I can't set the image height

Support
#1

Hello,
I can’t set the image height equal to that of the map which is 350px. Everything should be responsive. Is it possible to achieve?

#2

Hi Daniele,

Thanks for writing in! Upon checking, I see that your map height is around 270px.

Select your Image element and then head over to Customize tab and then under Element CSS section, add the following CSS rule.

$el {
  max-height:270px;
}

Hope that helps.

#3

Unfortunately it doesn’t work.

I had also tried that code, or rather I tried with max-height: 350px but nothing changes.

I do not understand why.

#4

Hey Daniele,

I went ahead and removed the previously given code and instead I added a class to your map element contact-map and then added the following code in your Cornerstone’s CSS section:

.contact-map .x-map-inner {
  padding-bottom: 66.8%;
}

This seems to have done the trick. Please clear your browser’s cache and check your page.

Cheers!

#5

Thanks, with this code it works. The only small imperfection is that now the image and the map are not centered vertically in the row. The space below is bigger.
If you can correct this too, it would be perfect.

#6

Hey Daniel,

Please also add this code in the Global CSS:

.contact-map {
    margin-bottom: 0;
}

Hope this helps.

#7

It works. Thanks

#8

You’re welcome!
It’s good to know that it has worked for you.