Centering images in separate widgets for Executive Pro

[j7an]

I currently have three separate widgets in my Executive Pro theme. But the items (BBB, Yelp, and Facebook) don't center as expected even when I use margin: auto and display: block.

I can only assume that each individual widget container is independent of the other containers which is probably why margin: auto and display: block doesn't seem to affect the positioning of the BBB logo.

Whats the best way to center the elements of the BBB, Yelp, and Facebook page elements?

https://dev.mysuperservice.com

[Victor Font]

You're images are centered horizontally. Are you talking about vertical alignment?

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[j7an]

Yes, I would like to center vertically as well. margin: auto should center on all sides of the element, but its not working.

[PyramidWeb]

Hi j7an,
In your "style.css", change

.home-middle .widget, .home-top .widget {
    float: left;
    padding: 0 2.8%;
    width: 33.3333%;
}

to

.home-middle .widget {
    float: left;
    padding: 0 2.8%;
    width: 33.3333%;
}

.home-top .widget {
    display: inline-block;
    padding: 0 2.8%;
    vertical-align: middle;
    width: 30%;
}

Note that you need to reduce the width of the widgets.

Hope this helps.

[j7an]

Thanks

[Author]

Posts