好吧,我想我已经使用空白修复了这个问题:无换行
它在 Chrome 中工作,但在其他方面不起作用。
我有这样的事情:
<div class="outer">
<ul>
<li>
<div class="inner">
<a href="#"><img src="eg1.jpg" /></a>
<br />
EG1 lorem ipsum
</div>
</li>
<li>
<div class="inner">
<a href="#"><img src="eg2.jpg" /></a>
<br />
EG2 lorem ipsum
</div>
</li>
.
.
.
//etc (multiple li's)
</ul>
</div>
excuse the really poor image but this is the efect im aiming for.
我想要单行“项目”,如果它们超出空间,则应该出现水平滚动条。
希望这是有道理的,我怎样才能实现这一目标?
像这样写:
.outer{
width:400px;
overflow:auto;
white-space:nowrap;
}
.outer li{
display: inline-block;
*display: inline;/*For IE7*/
*zoom:1;/*For IE7*/
vertical-align:top;
width:40px;
margin-right:20px;
background:red;
white-space:normal;
}
检查这个http://jsfiddle.net/ZrpHv/ http://jsfiddle.net/ZrpHv/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)