CODEWITHSUNDEEP
cssgoogle-chromemulticol
Kadoreko
Kadoreko

Reputation: 1

Multicolum layout in Chrome being weird

While building a mega menu using CSS-multicolumn to fill the flyout nicely with content boxes, I hit a snag: Chrome insists on arranging the blocks weirdly. Please open this fiddle in Chrome and in Firefox to see what I mean:

https://jsfiddle.net/061ar2x6/4/

Firefox does it right (i.e. the way I want it):

[ 1 ] [ 2 ] [ 3 ] [ 4 ]

But Chrome does this for some reason:

[ 1 ] [ 2 ]

[ 3 ] [ 4 ]

This is really annoying, because it often makes the flyout way longer than it needs to be while being half empty horizontally. Opera exhibits the same behavior, while IE/Edge is OK.

Can anyone tell me why this is happening and what I can do to avoid it?

Thanks :-)

<ul>
  <li>1<br>...</li>
  <li>2</li>
  <li>3</li>
  <li>4<br>...</li>
</ul>

Upvotes: 0

Views: 28

Answers (0)

Related Questions