No matter what images are always misaligned and sized wrong

I am attempting to have two columns rows with an image on one side and text on the other. I have multiple rows and the images continually change sizes and become misaligned. Does any know how to fix this issue so the images are aligned for all screen sizes?

Hello @trevorhall89,

Thanks for asking. :slight_smile:

I checked the website and misalignment seems to be causing because of padding. You need to adjust column padding-bottom values to make sure images are aligned.

Thanks.

I have 0 padding on all of them. The problem is if I choose 1 image size that fits for a certain screen size but is screwed up for every other screen size.

Hi there,

Unfortunately, you can not achieve the effect you want with the image element, as the image element makes the image smaller depending on the width of the wrapping container and you will always have a white section in one of the resolutions.

You will need to have a javascript based height calculation grid system to achieve the design you like. I suggest that you test out the Essential Grid plugin:

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.