开发者

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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜