Question

我已经在网上搜索了这个答案，但无济于事。

是否可以将包含固定宽度LI的UL置于宽度为100％的DIV中？

<div style="width:100%;max-width:1400px;">
    <ul>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
    </ul>

重要的是LI不在UL中居中。

编辑：UL的宽度也必须具有动态宽度才能填充动态宽度DIV。

提前感谢您的帮助！

Answer 1

默认情况下，ul也是100％宽要将其置于周围div中，您需要将width设置为ul。

以下是一个例子：

<div style="width:100%;max-width:1400px;">
    <ul style="width: 300px; left: 50%; margin-left: -150px;">
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
        <li style="width:280px;height:280px;>
    </ul>
</div>

请注意，ul的margin-left是width的一半。

Answer 2

那是什么

<div style="width:100%;max-width:1400px;">
<ul style="margin:auto; width:280px">
    <li style="height:280px;>d</li>
    <li style="height:280px;>d</li>
    <li style="height:280px;>d</li>
    <li style="height:280px;>d</li>
    <li style="height:280px;>d</li>
    <li style="height:280px;>d</li>
    <li style="height:280px;>d</li>
</ul>
</div>e

Answer 3

尝试在ul中添加一个类，例如

ul .centerUL { width:500px; margin:0 auto; #centers an element }

将具有固定宽度LI的UL定心在具有动态宽度的div中

3 个答案: