-
AuthorPosts
-
April 3, 2018 at 1:24 pm #936533
Hi there,
I am trying to create a full-width page with an image at the left and 2 other images at the right. I want the 2 images at the right to have equal height with the left image and scaling accordingly at desktop and mobile view.
The problem is that the 2 images at the right doesn’t resizing right in order to have equal height with the left image.
I am using the grid row element in avia layout builder.
How can i achieve that?
April 3, 2018 at 10:36 pm #936833Hey saquasar,
Your page returns a 404 error.
Could you please check that?Best regards,
BasilisApril 3, 2018 at 11:32 pm #936857Hi Basili,
It’s a draft page you have to be logged in with credentials i send you to see the page.thanks
April 4, 2018 at 1:47 pm #937142Hi saquasar,
It is hard to have the images scale perfectly, I can propose you a different solution, please use the code below and see if this works for you:
#puzzle-1 .flex_cell.no_margin.av_two_third.avia-builder-el-2 { padding: 10px 10px 0 10px !important; } #puzzle-1 .flex_cell.no_margin.av_one_third.avia-builder-el-4 { padding: 0 !important; } #puzzle-1 .av_textblock_section p { margin: -0.5em ; } #puzzle-1 .puzzle01, #puzzle-1 .flex_cell.no_margin.av_two_third.avia-builder-el-2 .flex_cell_inner { margin: -1em -0.5em -3em -1em; }
Let me know what you think.
Best regards,
VictoriaApril 4, 2018 at 7:53 pm #937355Hi Victoria,
It is working for the 2 images at the right but not for the image at left.
Is there a code that i can use to scale also the left image properly or should i have a certain dimensions at the images for width and height? For example the height of the image at left should be equal with the height of right image 1 + right image 2?
April 5, 2018 at 12:15 pm #937656Hi saquasar,
Try this code instead:
#puzzle-1 .puzzle01.puzzle-container { overflow: hidden; margin: -1em -0em -3em -0.5em !important; } #puzzle-1 .flex_cell.no_margin.av_two_third.avia-builder-el-2 { padding: 10px 10px 0 10px !important; } #puzzle-1 .flex_cell.no_margin.av_one_third.avia-builder-el-4 { padding: 0 !important; } #puzzle-1 .av_textblock_section p { margin: -0.5em ; } #puzzle-1 .puzzle01, #puzzle-1 .flex_cell.no_margin.av_two_third.avia-builder-el-2 .flex_cell_inner { margin: -1em -1em -3em -1em; }
If you need further assistance please let us know.
Best regards,
Victoria -
AuthorPosts
- You must be logged in to reply to this topic.