我有一个列表,我需要在我的页脚回应。
例如:

<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

10-01 01:25
查看更多