Why is there no float center in CSS?

css css-float
Kevin Cox picture Kevin Cox · Mar 11, 2013 · Viewed 47.8k times · Source

I have found that there is no float center in CSS and I was a little disappointed. However, I can't help but ask myself why. While many people want to use this for centering content I wished to use it to float a bunch of blocks into rows on a dynamic page size. Unfortunately without a float center it looks sloppy as there is extra space (whatever fraction of a full block doesn't fit) on one side. It makes me sad that the intended use of floats is hurt by this property missing.

I can't see a reason why there isn't a float center and was wondering if anyone had reasons, either technical or otherwise why a float center was not included in the standard.

Answer

Explosion Pills picture Explosion Pills · Mar 11, 2013

Instead of using float: left, use display: inline-block on the individual elements and center their container.

http://jsfiddle.net/ExplosionPIlls/rAkNY/5/

Related questions

How do I center floated elements?

I'm implementing pagination, and it needs to be centered. The problem is that the links need to be displayed as block, so they need to be floated. But then, text-align: center; doesn't work on them. I could achieve it by …

Read More
How to align 3 divs (left/center/right) inside another div?

I want to have 3 divs aligned inside a container div, something like this: [[LEFT] [CENTER] [RIGHT]] Container div is 100% wide (no set width), and center div should remain in center after resizing the container. So I set: #container{width:100%;} #left{…

Read More
How to float 3 divs side by side using CSS?

I know how to make 2 divs float side by side, simply float one to the left and the other to the right. But how to do this with 3 divs or should I just use tables for this purpose?

Read More