Inline block doesn't work in internet explorer 7, 6 -
i have css code inline-block. can tell me how make work in internet explorer 6 , 7. ideas? maybe i'm doing wrong? thank you!
#signup { color:#fff; border-bottom:solid 1px #444; text-transform:uppercase; text-align:center; } #signup #left { display: inline-block } #signup #right { background-image:url(images/signup.jpg); border-left: solid 1px #000; border-right: solid 1px #000; display: inline-block; padding:1% 2% width:16%; } #signup #right { font-size:100%; font-weight:bold } #signup #right p { font-size:90%; font-weight:bold } #signup a:hover { color:#fff; text-decoration:underline }
in ie6/ie7, display: inline-block works on elements naturally inline (such spans).
to make work on other elements such divs, need this:
#yourelement { display: inline-block; *display: inline; zoom: 1; } *display: inline uses "safe" css hack apply only ie7 , lower.
for ie6/7, zoom: 1 provides haslayout. having "layout" prerequisite display: inline-block work.
it possible apply workaround while keeping valid css, it's not worth thinking about, particularly if you're using vendor prefixed properties.
read this more information display: inline-block (but forget -moz-inline-stack, required ancient firefox 2).
Comments
Post a Comment