Question

我的页面顶部有自定义滑块，但我遇到了一些问题。我希望列表项能够延伸到屏幕的宽度，但我遇到了问题，因为列表项目显示在另一个下面。我已将它们设置为浮动，并且我在列表周围有一个div，其中隐藏了溢出但无效。

我想要它，以便当前幻灯片是屏幕的宽度，无论大小，最小宽度为960px

HTML

<div id="slider">
    <div class="slides">
        <ul>
            <li class="slide">
                one
            </li>
            <li class="slide">
                two
            </li>
            <li class="slide">
                three
            </li>
        </ul>
    </div>
</div>

CSS

#slider {
    position:relative;
    margin:0 auto;
    top:85px;
    width:100% !important;
}

.slides {
    margin:0 auto;  
    overflow:hidden;
    text-align:center;
    position:relative;
    left:0;
}

.slide {
    height:630px;
    width:100%;
    float:left;
    position:relative;
}

Answer 1

试试这个......
添加如下的css类。

.ul_class {
    margin: 0;
    padding: 0;
    list-style: none;
    float: left;
}

之后，将此新类（ul_class）分配给您的<ul>。

<ul class="ul_class">
    ...
    ...
    ...
</ul>

希望这会对你有所帮助。

强制水平列表100％宽度

1 个答案: