css - Flexbox and Internet Explorer 11 (display:flex in <html>?) -
i planning move away "floaty" layouts , use css flexbox future projects. delighted see major browsers in current versions seem support (in 1 way or another) flexbox.
i headed on "solved flexbox" http://philipwalton.github.io/solved-by-flexbox/demos/sticky-footer/ @ examples. "sticky footer" example not seem work in ie11. played around bit , got work adding display:flex <html> , width:100% <body>
so first question is: can explain logic me? fiddled around , worked, don't quite understand why worked way...
then there "media object" example works in browsers except - guessed - ie. fiddled around that, too, no success.
my second question therefore is: there "clean" possibility "media object" example working in ie?
according http://caniuse.com/#feat=flexbox:
"ie10 , ie11 default values flex 0 0 auto rather 0 1 auto, per draft spec, of september 2013"
so in plain words, if somewhere in css have this: flex:1 , not translated same way in browsers. try changing 1 0 0 , believe see -kinda- works.
the problem solution mess firefox, can use hacks target mozilla , change back:
@-moz-document url-prefix() { #flexible-content{ flex: 1; } } since flexbox w3c candidate , not official, browsers tend give different results, guess change in immediate future.
if has better answer know!
Comments
Post a Comment