开发者

Problem with CSS DIV align

If the doctype declaration is <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 TRANSITIONAL//EN"> what is the best way for horizontal alignment of the DIV's like these:

<div id="outer"><div id="inner">Some text</div></div>

The CSS is:

#outer{ border-top:1px dotted #999; background-color: #F4F4F4; width:100%;}
#inner{ width:500px;border:1px solid #F00; margin:auto;}

The thing that I want to do is the inner DIV align at center (horizontally) inside the outer DIV. This CSS working fine if the doctype declaration is <!DOCTYPE html PUBLIC "-//W3C//DTD XHT开发者_C百科ML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Don't know which browser you use, but you could change

 #outer{ border-top:1px dotted #999; background-color: #F4F4F4; width:100%;} 

to:

 #outer{ border-top:1px dotted #999; background-color: #F4F4F4; width:100%; text-align:center;} 

Allthough.. I've tested your code on IE8, FireFox and Chrome and all three worked like a charm...


It seems you need to learn a bit about quirks mode.

0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜