I have the following divisions: <div style="position: absolute; top: 20px; left: 183px; height: 5px; width: 6px; background: #3A3A3A; background: #3A3A3A url('images/navshadowright.jpg.jpg') no-repeat; z-index: 99;"> </div> Code (markup): <div style="position: absolute; top: 20px; left: 167px; height: 13px; width: 16px; background: #3A3A3A url('images/navshadow.jpg') no-repeat; z-index: 100;"> </div> Code (markup): This seems to work fine in Firefox, but it seems that IE takes up more spaces than ones specified. My question is this. q1. Can you specify the size of a division (<div></div>) using CSS even if it's really small? q2. If so, how? q3. What am I doing wrong in my code?
I think IE6 has a minimum of something like 18 pixels. I have had this problem too. The solution, which is kind of fun, is to make the div above it have a 5px border. IE reads borders fine for small heights, or even HR tags which you can edit. However, with divs for some reason it has issues. Hope this helps.
Have no idea why a 5 pixel border would solve this, but the solution is setting a small line-height (0, 5px even) I made this page to verify myself --> http://www.soulscratch.com/playground/css/msie/height.html And the issue is not with divs. It can really be any type of element.
For the purpose of clarification ... Having the following ... font-size: 1px; line-height: 1px; ... solves this problem. Thanks for the great help, everyone ...