[web] CSS Positioning
I want to use
top:0px;
bottom:1px;
left:0px;
right:1px;
to size my div. This works great in firefox, but dies in IE. How do I do this?
-Greg
In IE when you try to set the width/left/right using a combination of left and right it assumes left:0; width:100%; A workaround is to set it to left:0; width:100%; margin-left: something; margin-right: something;
<html><head></head><body><style>div.outerBox{ position:relative; top:0px; left:0px; height:100%; width:100%; border-style:solid; border-width:1px; margin:0px;}div.innerBox{ position:absolute; top:0px; left:0px; bottom:1px; right:1px; border-style:solid; border-width:1px; margin:0px;}</style><div style="width:20em; height:20em;"> <div class="outerBox"> <div class="innerBox"></div> </div></div></body></html>
This shows what I mean. The inner box is NOT 1px away from the bottom right... (in internet explorer)
This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement