html - Forcing horizontal list 100% width

Question

I have custom slider sitting at the top of my page but I'm having some issues. I would like the list items to stretch to the width of the screen but I'm having issues forcing this because the list items display below one another. I have set them to float and I have a div surrounding the list with an overflow hidden but to no avail.

I want it so that the current slide is the width of the screen regardless of size, possibly with a min width of 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>  

希望这会帮助你。