css - How do you make a <div> less than 13px tall in IE6? -
how make divs short in ie6? no matter if use 0.3em or 3px, ie6 forces minimum of 13px.
ie6
firefox 3.6.13 (looks quite similar in other modern browsers)
html
<div id="fileprogressbar" style="display:none"> <div id="fileprogressfill"></div> </div>
css
#fileprogressbar { height: 0.3em; background: #444; background: -moz-linear-gradient( top, #333, #666 ); background: -webkit-gradient( linear, left top, left bottom, color-stop(0, #333), color-stop(1, #666) ); border-top: 1px solid #000; } #fileprogressfill { height: 100%; width: 0; background: #0088cc; background: -moz-linear-gradient( top, #0099e5, #006699 ); background: -webkit-gradient( linear, left top, left bottom, color-stop(0, #0099e5), color-stop(1, #006699) ); }
javascript
javascript reveals file progress bar @ appropriate times , updates file progress fill movie playing. bug not js issue, won't post js code.
turns out overcomplicating bit:
just do:
#fileprogressbar { height: 3px; font-size: 0; .. }
to fix in ie6, #fileprogressbar
, add font-size: 3px
. however, makes wrong in normal browsers. so, easiest way fix either apply style in conditional comment, or add this, using css hack (which fortunately validate) ie6 can see it:
* html #fileprogressbar { font-size: 3px }
i'm going see if there's neater way fix this.
Comments
Post a Comment