Building a grid framework with inline-block's

Question

I\'m about to update http://getcrow.eu and have one \"issue\" to solve that would make the framework everything I always wanted it to be.

Important to know: Crow does no

Answer 1

InuitCSS (my choice of framework lately) uses a similar system. As wonderful as the use of display: inline-block; is in a grid system, it does appear that the whitespace issue, is an inherent one; with little chance of resolution beyond the current workarounds.

I agree that the use of comments or closing tags does introduce some issues with CMS entries, and a certain amount of mental overhead for the developers involved; but not an unmanageable amount.

If you want to have a look at Inuit's grids I would recommend it's GitHub found here: https://github.com/inuitcss

I would also advise reading this issue, in-which Inuit's creator; Harry Roberts, weighs in on the various solutions this problem. Whilst it may not tell you anything you don't already know, it is an interesting (if outdated) discussion on the matter.

https://github.com/csswizardry/inuit.css/issues/170

I know that the above may not solve your issue, or even shed any light on the matter, but I hope it can be of use.

Answer 2

Using a float is your best option.

.parent div {
    float: left;
}

Following your comments below you could use a negative margin.

.parent div {
    margin-left: -4px;
}

But this may change browser to browser.