Question

我需要一些元素来填充包含它的元素的空间，例如，这是代码：

<header class="w_head">
        <div class="container-fluid">

            <ul class="w_social text-right">
                <li><a href="#"><img src="images/Twitter_logo_blue.png"/></a></li>
                <li><a href="#"><img src="images/g+images-2013-01-15/g+ icon/Desktop/44dp/2x/btn_white.png"/></a></li>
            </ul>

        </div>
    </header>

和样式：

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
}
.container-fluid{
    position:relative;
}

.w_head{
    background-color: #66757f;
    height: 2.6em;
    width: 100%;
    position: relative;
}

我需要将ul自动放置在内部，并根据标题大小而不是整个文档。

Answer 1

你可以制作一个外部容器并使其溢出......

<div id="container">
    <ul>
       <li>whatever</li>
       <li>whatever</li>
       <li>whatever</li>
       <li>whatever</li>
       <li>whatever</li>
       <li>whatever</li>
       <li>whatever</li>
       <li>whatever</li>
       <li>whatever</li>
   </ul>
</div>

#container{
height:100px;
width:300px;
overflow-y:auto; 
overflow-x:none; 
border:1px solid black;
}

http://jsfiddle.net/6Le454nd/＆lt; - 工作演示

Answer 2

从您所写的内容开始，我可能错了，请告诉我。您希望UL成为100%的{{1}}，就像您已经拥有的那样。

如果w_head为w_head宽，那么600px也是如此，请注意，如果正文为UL且800px设置为w_head }目前这是真的100%是w_head，800px也是如此。

根据包含它的div设置英尺大小

2 个答案: