I am having problems with forcing divs onto a new line, when using floats.
Here is my code pen //codepen.io/joe/pen/rGKEy
As you can see, the 5th box is butting right up underneath the 4th box, rather than starting a new line.
I have tried clearing but this doesn’t seem to work.
I want to avoid using min-height as the content will be provided dynamically.
Any help would be great.
Replacing float left with inline-block seems to do the trick, although I would be sacrificing support in IE7 but this seems like the best option so far
here’s a fork using floats and a clear after every 4th .box – of course early IE won’t recognize this either, so I supplied a jquery workaround.
here’s slightly different approach you can maybe find useful for something: //codepen.io/jiri/full/jwmKf
You must be logged in to reply to this topic.