Align these logos

Hello,

It’s a bit difficult to actually see what the problem is as we can’t see the website but let’s see if I can help.

The first thing is the sometimes the white space between the <img> tags in the widget can cause the images not to line up correctly, but it looks like you’ve done it fine from the picture.

What CSS does the ‘sponsor-img’ class have applied to it? Are they float: left or display: inline-block; ?

I’ve unlocked the website for the day so you can have a look.

wishwalk.ca

It’s the footer advertisement section at the bottom of the page. Thanks for your help!

Thanks.

Looks like you need to change your display:block to display: inline-block as below:

img.sponsor-img {
    display: inline-block;
}

There’s also this CSS rule overriding the above so delete this one or add an important to the display value above, otherwise it wont work.

footer.mh-footer img {
    display: block;
}

Thanks for your help, graphicscove!

I’ve tried your solution but it didn’t work.,, but, by adding this :

img.sponsor-img {
float: left;
}

I managed to get them aligned. Now the 3 logos need to be centered vertically and horizontally.

Take off the float:left and try this:

img.sponsor-img {
    border: solid 1px blue;
    display: inline-block;
    vertical-align: middle;
}

It worked perfectly.
Thank you very much for your help!

No worries, glad I could be of assistance!