我目前有五个 <li>
元素。每个<li>
定义为 25% 宽度:
ul li {
float: left;
width: 25%;
}
并在包装器容器中定义:
#wrapper {
position: absolute;
width: 125%;
}
我想要做的是:让前四个元素出现在屏幕上,占据 100% 的宽度,并让最后一个元素漂浮在屏幕外。
注意:最终可以有超过五个元素。
我的经验是,虽然我的包装器设置为适合 5x25% = 125%,但最后一个元素“崩溃”了,第四个元素没有在屏幕上显示完整的 25%。
在这里 fiddle : http://jsfiddle.net/pJNAV/1/
最佳答案
正如你所拥有的:
#wrapper {
width: 125%;
}
你有 5 个元素,所以每个元素都是父元素的 20%,所以
ul li {
width: 20%;
}
关于javascript - 使五个宽度为 25% 的左浮动元素继续 float 到屏幕外,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21859833/