Fixing the Gaps in inline-block →

If you need to line HTML elements up horizontally in CSS, display: inline-block is a great solution that comes with a lot less baggage than float.

Not no baggage, though: it puts unwanted little spaces between elements, the way display: inline does. Here’s the classic article outlining the issue.

If you’re tired of working around this problem, there’s a simple solution that uses font-size: 0 to set the size of the spaces to 0. As usual, Chris Coyier from CSS-Tricks does a great job outlining it.