3 images won't center the page

Hi there.

I can’t seem to get 3 images in 3 divs in an display:inline-block; to center in the page (viewport). I am using Sydney (obviously) and the images are on the template Front Page. I have tried columns and even that doesn’t get the middle image in the middle. Is it me or is there something in the template or theme that I am overlooking?

I hope you can help. Thanks!

I am working localhost so I cannot give you a site to look at but this is the page (code)

<div class=“center”>
<div class=“driefotos”>
<h3 align=“center”>Small</h3>

De kleinste versie van onze koffie-installatie

<div class=“driefotos”>
<h3 align=“center”>Medium</h3>

De koffie-installaties maar nu met de mooiste bar aan deze kant van de maan er bij. Van waaruit we natuurlijk nog veel meer kunnen dan alleen koffie en thee schenken.

<div class=“driefotos”>
<h3 align=“center”>Large</h3>

Vind jij die stretchtenten ook zo mooi?

And this is the .css

.driefotos {
float: left;
margin: auto;
padding: 15px;
width: 300px;
height: 300px;
vertical-align: top;

regards Colin


If you could post a website URL I would be able to help you with this better, but at last, please post a screenshot, so I can check how it looks like.

Best Regards,

Hi Csaba

here is a screenshot in which you can see that the three images are not in the middle. The button ‘Scroll Down’ is.