Center block level elements in IE WIN with no problems!

liunx

Guest
I want this to be half the width of the browser window and be centered. Quite easy to do in Firefox/Netscape etc. IE 6 for Windows screws up a number of centering techniques I know:


<style type="text/css">
body{width:100%;}
.centerThisDamnIt{
background-color:blue;
border-top:2px solid silver;
border-left:2px solid silver;
border-bottom:2px solid gray;
border-right:2px solid gray;
color:white;
display:block;
font-family:Fixedsys, "Courier New", Courier, mono;
font-size:14px;
font-weight:normal;
margin:0.5em 0 0 25%; /* Tried various things here */
overflow:hidden;
padding:5px;
text-align:center;
width:50%; /* Doesn't really look like 50% width in IE 6 Win even with the body tag having width:100%; */}
</style>



<a href=http://www.webdeveloper.com/forum/archive/index.php/"http://n.eu.kz/" class="centerThisDamnIt">N.EU.KZ</a>


I've also tried:

margin:0.5em auto 0 auto;
margin:0.5em 0 0 auto;
margin:0.5em 25% 0 25%;width: 50%;
margin: 0.5em auto 0 auto;

And make sure your page starts with a valid doctype, such as...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

...so that IE is not running in "quirks" mode.

Also note that the actual displayed width will be width + left-padding + right-padding + left-border-width + right-border-width as the 'width' parameter applies to the actual content of the element.Unfortunately this page must be displayed in quirks mode (my CSS is being displayed on top of someone else's page which has no DocType). Is there anything else I can do to fix it?
 
Back
Top