Question

您好我正在尝试编写一个页脚，因为它们的宽度应该具有平衡宽度的项目。

在我的例子中，如果句子很长，似乎有一个更大的填充。＆＃34;博客＆＃34;有一点填充，＆＃34;第一列很长＆＃34;有一个很大的。

请求帮助。

<div class=footer>
<UL>
<LI>First column very long</LI>
<LI>Contact us</LI>
<LI>Blog</LI>
<LI>Privacy policy very large title</LI>
<LI>why?</LI>
<LI>The last sentence</LI>
</UL>
</div>


.footer{
width:100%;
 border: 1px solid yellow;
 }
 .footer ul
{
 list-style-type:none;
display:table;
width:100%;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
padding:0;
}

.footer ul li
{
 display:table-cell;
text-align:center;
border:1px solid red;
}

https://jsfiddle.net/rtjposu9/

Answer 1

这是一种非常正常的现象。如果您希望平衡元素的宽度，请使用宽度百分比来帮助您，例如width:16.66%;

但是，由于这会导致另一个字词溢出问题，您还应该使用overflow:hidden和word-wrap:break-word

css页脚菜单显示：表格和项目不平衡

1 个答案: