Centering multiple inline-block divs

[CeeDesign]

Hey.

I’m trying to center these four divs in a parent div but without results.
margin: 0 auto usually does the job with block elements, but now I really need you divs to stay on one line!

I wouldn’t want to post all the code here, but take a look at the site.

How can I center all these inline-block-level divs inside another div?

http://foxcenter.url.ph/kuntosali/blogit/

[Paulie_D]

Inline block divs can be centered by applying text-align:center to their parent.

[Senff]

Looks like the link in your original post is wrong (points to a generic page of a UK hosting company). Please check and try again.

[CeeDesign]

Well looks like I can’t edit my post.
But here’s the link: http://foxcenter.url.ph/kuntosali/blogi/

[Paulie_D]

Did you fix this?…the portrait blocks look centered to me…or is it something else?

[CeeDesign]

Yep. Thanks to your “inline-block” advice.
But now how could I center the inline-blocks vertically as well?

[Paulie_D]

But now how could I center the inline-blocks vertically as well?

Well, basically, you can’t.

What you can do is wrap those elements in div and vertically center that.

https://css-tricks.com/centering-in-the-unknown/

Instead of vague ‘can you’ questions, perhaps you could provide a reduced case demo in Codepen of your existing HTML & CSS and we can go from there.

Also, if you have a design image of the finished article that would help.

[Author]

Posts