Images Not Aligning Correctly on Landing Page

[Claudia_Lab]

We have a landing page that lists providers with associated logos next to the provider names. The first two images are not aligned with the names the way the rest are aligned. 

I've checked CSS declarations to see if there are any glaring issues there, but everything matches. 

What else can I be checking to determine why 2 out of ~60 images wouldn't be properly aligned? 

[Jsum]

@Claudia_Lab,

I am pretty good at finding these types of issues but I can't do much without seeing the page.

If you can share a shareable link to the page I can can check it out for you.

Need help? Hire Us Here

[Claudia_Lab]

https://carrier.macropointconnect.com/technical-documentation

[Jsum · Accepted solution]

@Claudia_Lab, Its a height thing, none of your images are actually lined up except that their height is about equal to the height of the container for the row. 

To truly verically align your images you can use flexbox or positioning. I would use flexbox.

.image-container {
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
   
    justify-content: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
}

You don't have any unique classes for me to use here. You can add a class to the container then use that to target the containers to your images, or/and give the image modules a class like '.table_images' so you have something to work with. 

Need help? Hire Us Here

[Claudia_Lab]

Ahhh, I see! Thank you very much!