Tagged: Elements in rows
When using pictures / sliders on one side and an other element on the other side in one row I’m desperate. I don’t see any reasonable enfold setting option to control the max heights of elements in one row. (1,2)
For example yo use an image/slider on the left and another element on the right. You have no control to limit the height of the left image / slide. It works only in big resolutions (3) and looks ugly below (4). It’s just displayed much too larger and this up to landscape mode. Have not found a setting, work-around, css code to solve this problem. Even media queries doesn´t work properly.
Do you have Solution?
Hey Sven,
Sorry for the late response. The image seems to be resizing or responding correctly on smaller screens. Did you figure out the issue?
Best regards,
Ismael
No. This is a current issue.
Hi,
If you want the left image to be taller or larger on smaller screen sizes, try adding another image element with a taller aspect ratio. The current image is a bit square and gets squeezed disproportionately in height compared to the right widget because it’s inside a smaller column (1/4 width). After adding the other image, you can toggle the visibility of both images on different screen sizes using Advanced > Responsive > Element Visibility options.
You can also add this css code to adjust the width of the column containing the image.
@media only screen and (max-width: 1024px) {
/* Add your Mobile Styles here */
#top .flex_column.av-acgfsc-cb6752318e4619c3295e6429d893dcfc {
width: 50%;
margin-left: 0;
}
}
After adding the css:
Best regards,
Ismael