CSS all sticks to the left using IE
I've created a web-a开发者_开发问答pplication and been testing it up until now only on Chrome and Firefox.
When I try opening it in Internet Explorer and it seems all of my div's do not get positioned in the middle but all stick to the left side of the window.
what can i do to fix this?
In the beginning i had the same problem with chrome and firefox but after i added this:
*{margin: 0px auto;}
to my CSS file it all seemed to center itself.for example :
<body>
<div id="cont">
asdasd
</div>
</body>
And css :
#cont {
margin : 0 auto; // Normally centered #cont for Chrome, Firefox and IE
}
body {
text-align : center; // But for perfect centering, IE need this.
}
Because , if you set BODY's text-align to center , All div's (which inside of <body>
) will centered in IE . And then, you have to set this div's text-align to left, manually . You can try
You can try a Internet Explorer hack and put the margins right and left as auto. Such as:
html * div {
margin-left:auto;
margin-right:auto;
width:600px;
}
If you have a div or other tag that you want centered on the page, you need to specify a width for it, and then using the margin rule center it. What IE needs to see, at least 8 to my understanding, is that the parent div be a width of 100%. So something like this:
<html>
<body>
<div id="myDiv">
<p>Some text</p>
</div>
</body>
</html>
Then the CSS:
body {
width: 100%;
}
#myDiv {
/* this will center horizontally only, i assumed that is what you wanted */
margin: 0px auto;
width: 500px;
}
精彩评论