About Section image

Hi There,

Both sections height are adjusted to 500px.
Your image might be of less height or did not fit in proportion, so edit the image and increase the height of image to be in 712*500px (width*height) ratio maintained.
It will then fit.

Thanks!

Hi,
thanks for your reply.

I’ve increased image with 712*500px ratio but it doesn’t works and the white space remain, instead it works and I’ve solved with 712*550px ratio.

Thanks for your help.

Hi,
I’ve increased the height of About section in Home page with this code:

.about .about-content {height: 690px;}

But now the image on its left has a fixed height, how can I fix it with image that cover the empty space?

Thanks.

• This reply was modified 7 years, 2 months ago by Fabio G.
• This reply was modified 7 years, 2 months ago by Fabio G.

Hi,
in addition to above problem, I’ve noticed that after added that code, with my 15″ monitor I see the full text, but with a 20″ monitor and from mobile version of website, the CSS code doesn’t works and text is cutted.

Please, can you help me to fix it?
Thanks

When you put the fixed height, then it will surely affect on the various screen size.
Thanks!

And how can I increase the height of left image until 690px?
Thanks.

Similarly as content:

.about figure.about-img {
    height: 690px;
}

Thanks!

Thanks, but it works partially.
As you an see in the following link, always remain a little white space below image.

https://refertazioneremotanetwork.it/

Add this code:

.about-img img {
width:100%;
}

Thanks!

Hi,
it doesn’t works.
As you can see, there is always a white space below the image.

Hello There,

Add this:

.about-img img {
    width: 100%;
    height: 690px;
}

Thanks!

It works from pc desktop, but from mobile it create the same problem.
Can you help me to fix it?

• This reply was modified 7 years, 2 months ago by Fabio G.

Try this way:

@media and screen(max-width:640px){
.about-img img {
    height: 200px;
}
}

Replace the height value as your need.
This will only be effective for screen size below 640px width.

Thanks!

Hi,
sorry but I explained badly.
I mean in mobile version, the text of About section is cut, but I think I’ve solved in this way:

@media screen and (max-width:640px){.about .about-content {height: 1180px;}}

I’ve changed @media and screen in @media screen and

and then I’ve added {.about .about-content {height: 1180px;}}

It seems works now on mobile, but can you tell me if this code is correct?

The only problem is that now in mobile version the image is stretched.
How it can be fixed?

Thanks in advance.

• This reply was modified 7 years, 2 months ago by Fabio G.

Hi There,

Sorry I mistyped it:
It should be like as you said:

@media screen and (max-width:640px){
.about .about-content {
height: 1180px;
}
}

AS you have added the height directly in image, it will surely stretch, there is no way, if you remove height then there will appear white space, so you need to choose one thing either fill the screen or do not stretch the image.

Thanks!