internet explorer - IE (11) improper handling of CSS multi-columns? -


i'm building 2-column layout using css multi-columns, , want give hint break columns.

so say: columns: 2 on container, , break-before: column on child want break.

ie (11 in case) decides split content 3 columns , overflows right of box :-(

chrome (using prefixed alternatives -webkit-columns:2 , -webkit-column-break-before: always) behaves nicely.

fiddle at: http://jsfiddle.net/jdecq/6/

am doing wrong here ?

is misbehavior of ie ?

any workaround suggestions ?

as myself interested in question studied spec , examples of multi-column layouts.

first have spec horribly "imprecise"!
seems break definition has precedence on column-count value (though not find explicitly in spec or anywhere else).

this happens if, according multi-column pseudo-algorithm, respective element, sets break point, part of last column (as in example fiddle).

the example given @gcyrillus (see comments on question) works, because height setting forces algorithm first fill given height before additional column boxes created in inline direction.
can see "original" effect, if change height 20em 10em!

so after all, tend not bug , ie behaves correctly.

at least might error or shortcoming of multi-column algorithm not recalculate or refill columns despite breaks column-count value respected. logically can done long number of defined break points 1 less column-count value.

as ie 10+ browser supporting multi-column module including break-xy properties, hard tell if behaviour right or wrong , how other browsers handle in future!

for now, recommend not use these properties @ all.


Comments

Popular posts from this blog

PHPMotion implementation - URL based videos (Hosted on separate location) -

javascript - Using Windows Media Player as video fallback for video tag -

c# - Unity IoC Lifetime per HttpRequest for UserStore -