这是一些 HTML。
<div id = "header">
<div id = "menu">
<ul>
<li><a href = "#">Home</a></li>
<li><a href = "#">Browse</a></li>
<li><a href = "#">Account</a></li>
<li><a href = "#">About</a></li>
</ul>
</div>
还有一些 CSS
#menu
{
width: 80%;
height: 30px;
}
#menu li a
{
display: block;
background-color: #999999;
color: #FFFFFF;
font-weight: bold;
line-height: 30px;
text-align: center;
}
上面的 HTML 和 CSS 给出了 4 个矩形。我想让这些矩形在 menu div 内水平均匀拉伸(stretch)。
每次尝试时,我要么在关于矩形(即最后一个矩形)之后获得可用空间,要么让关于框流到下一行。
感谢帮助
最佳答案
你需要添加:
#menu li a
{
float:left;
width:25%;
}
#menu li
{
display:inline;
}
关于html - 如何在 div 内水平拉伸(stretch)内容,使其均匀占据所有空间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8378058/