By using’s services you agree to our Cookies Use and Data Transfer outside the EU.
We and our partners operate globally and use cookies, including for analytics, personalisation, ads and Newsletters.

  • Join the Best Unofficial Elementor Support forum

    Provide or get advice on everything Elementor and Wordpress, ask questions, gain confirmation or just become apart of a friendly, like minded community who love Wordpress and Elementor

    Join us!
elementor official

responsive SVG Map



New Member
Hello everyone,

I have some issues with a SVG map on my website.
Here is the link

It's in a full width section, in the 3rd column out of 3.
  1. first one is equal to the margin in boxed content section
  2. second is equal to 50% of 1140px
  3. third one where is my SVG map takes all the remaining space.
I would like my SVG map to fit the exact height of the section whatever the screen resolution is, to stick to the right of the screen but to have no limit on the left side according the the % of the width. If it goes out of the column on the left side then it should be displayed under the middle column.

I have this custom CSS so far :

.svg-container {
 display: inline-block;
 position: relative;
 width: 150%;
 padding-bottom: 100%;
 vertical-align: bottom;
 overflow: hidden;
.svg-content {
 display: inline-block;
 position: absolute;
 top: 0;
 left: 0;

Thank you very much

Latest posts

Latest Resources

Other Elementor Resources

elementor official