<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<style type="text/css" media="screen">
div.menu {position: relative; width: 600px; overflow: hidden;}
ul.menu {display: block; padding: 0px; width: 1500px; margin: 0; list-style: none;}
.menu li {display: block; float: left; padding: 0 2px; }
</style>
</head>
<body>
<div style="width: 500px;" class="menu">
<ul class="menu">
<li>
<div id='outer'>
<div id='inner' style="margin:0 auto;width:100px;">
I want this text to show up
</div>
</div>
</li>
</ul>
</div>
</body>
这是一个完整页面的简化版本。我可以在FF中看到‘我希望这个文本显示出来’的文字。但这在IE7和IE6中是看不见的。当我从内部的DIV中删除“自动”这个词的时候,它就会出现在两个探险家身上。我怎么才能解决这个问题?我不能删除'auto‘,因为我希望内部div在外部div内集中对齐。
注意:它是DIV滑块的一部分.
发布于 2009-11-05 18:52:55
关于问题本身,IE开发人员工具表明正在发生以下情况(粗体中的IE例外):
转换为div.menu :visible快速地使文本的位置显示为
建议的解决办法:
500px.
即可。
在我看来,CSS中有几个部分似乎没有意义,也许一旦清理完毕,可能会使问题更容易隔离。
发布于 2009-11-05 18:49:48
div#outer可能会跨越LI的全部宽度,这个宽度为1500 LI(继承您的UL声明)。如果div#inner居中且100 it宽,它将显示在溢出范围之外:隐藏在div#menu上。
我相信我能看到你想用这个做什么,也许是想要一个画廊滑块。你可能需要明确地把你的李的宽度设置为500 LI。然后,你可以让三个李在一起漂浮在一起。
发布于 2009-11-05 19:12:33
如上所述,您的div#outer正在跨越LI的全部宽度(1500 LI)。Div是块级元素,这意味着在默认情况下,它们将跨越包含元素的整个宽度,除非另有说明。
另外,关于LI错误地从它包含的元素中获取它的宽度而不是它的子元素的说法是不完全正确的。默认情况下,这是正确的,但是声明使LI (display:block;)的CSS规则将LI从内联元素更改为块级元素,与DIV一样,该元素将从它包含的元素中获取它的宽度。
In :默认情况下,块元素跨越其包含元素的整个宽度,默认情况下,内联元素跨越其最宽子元素的宽度。
https://stackoverflow.com/questions/1682596
复制相似问题