How do you center a div with Internet Explorer?
i have trouble with internet explorer and centering , my question is how can i centering a div without the CENTER tag and it got to work in all the browsers , because i was using
margin:auto;
it works in all borwsers but it d开发者_开发技巧oes not work in internet explorer i'm looking for something that will work in all the browsers someone told me to put
text-align: center;
to the body but than all the text has go to the middle
so how can i do that?
You're close. Use the CSS below:
margin:0 auto;
Here's a working jsFiddle. Note that I gave the div a fixed width.
You need to specify a width as well as margin:
div.center { width:980px; margin:0px auto; }
Example HTML:
<html>
<head></head>
<body>
<div class="center">CONTENT</div>
</body>
</html>
IE has spotty support for auto margins (i.e., different behavior in quirks mode). This should work in pretty much all cases though:
CSS:
.container {
/* for IE */
text-align: center;
}
#the-div {
/* reset text-align */
text-align: left;
/* for "good" browsers */
margin: 0 auto;
}
HTML:
<div class="container">
<div id="the-div">centered content</div>
</div>
Yes this works perfectly in IE.
.container {
/* for IE */
text-align: center;
}
#the-div {
/* reset text-align */
text-align: left;
/* for "good" browsers */
margin: 0 auto;
}
Your CSS is close, the your issue isn't the browser. The simple fix is to change the inner div class.
You have your position absolute with Left 25%... Use Left 50% and it will autocorrect.
Remove the left: 50% entirely and add margin: 0 auto; as previously noted on another answer.
精彩评论