我有一个列表,我需要在我的页脚回应。
例如:
<ul>
<li>About</li>
<li>Contact</li>
<li>Company Information</li>
<li>Contact Us / Help</li>
</ul>
我需要做的是在页脚有那个ul,这样项目就在多行中间。
所以看起来像是:
About Contact Company Information Contact Us / Help
然后在移动设备等上:
About Contact
Company Information Contact Us / Help
但我不知道怎么做。
CSS现在只是一个基本的水平列表。。。jsfiddle:https://jsfiddle.net/cgke4hvu/
如果你在小提琴上调整预览的大小,希望你能看到我的要求。
谢谢。
最佳答案
您必须删除float: left
并使用此CSS:
body {
width: 100%;
}
ul {
list-style-type: none;
border: 1px solid blue; /* added just for clearer view */
text-align: center; /* added */
}
ul li {
display: inline; /* added */
text-align: center;
margin-left: 10px;
margin-right: 10px;
}
尝试fiddle