1

我有一个<div>每个都有两个 s的列表,<li>我想将它们一个并排浮动,我希望<li>占据整个可用空间。我该怎么做?

<html>
    <head>
        <title></title>
        <style type="text/css">
            body {
            }
            ul {
            }
            li {
            }
            .a {
            }
            .b {
            }
        </style>
    </head>
    <body>
        <ul>
            <li>
                <div class="a">
                    content
                </div>
                <div class="b">
                    content
                </div>
            </li>
        </ul>
    </body>
</html>
4

7 回答 7

4
 *{ margin: 0; padding: 0;}
 li{  width: 100%: display: block; } 
 li:after{ clear: both; } 
 div.a{ width: 49%;  float: left; }
 div.b{ width: 49%;  float: left; } 

应该做的伎俩。

于 2008-09-18T15:36:19.707 回答
2

对于 div,您只需要向左浮动,而 li,您要清楚。所以:

li
{
    clear: left;
}
.a
{
    float: left;
}
.b
{
    float: left;
}
于 2008-09-18T15:38:14.103 回答
1

我看到这是一篇旧帖子,但如果有人遇到同样的问题,请考虑一下:

<div>A block-level section in a document</div>
<span>An inline section in a document</span>

您可以使用span代替div

要获得除另一个或水平的div,您必须使用 . css但如果你使用span它自然会。将以下代码复制并粘贴到html中,看看我在说什么:

<ul>
  <li>
      <div style="background-color:red">red</div>
      <div style="background-color:blue">blue</div>
  </li>
  <li>
      <span style="background-color:red">red</span>
      <span style="background-color:blue">blue</span>
  </li>
</ul>

此外,至少对于 Microsoft<li><div></div></li>不会进行验证。

于 2013-01-24T17:56:32.730 回答
0

无需检查以确保,这应该可以工作


LI { width: 100%; }
.a { float: left; }
.b { float: right; }
于 2008-09-18T15:36:05.387 回答
0
li { width: 100%;}
.a { float: left;}
.b { float: left;}
于 2008-09-18T15:39:01.230 回答
0

我假设占据整个空间意味着 100% 的宽度。我还假设您不希望将样式应用于列表,这就是我在此示例中删除它的原因。这也是无黑客攻击的。你不需要清除任何东西,只要你的列表项有一个宽度和溢出:隐藏的属性/值对。

ul,
li {
    width: 100%;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
li {
    overflow: hidden;
}
li div.a,
li div.b {
    float: left;
}
于 2008-09-18T16:15:26.557 回答
-1
li{width:100%;}
.a{}
.b{float: left;}

根据我对 CSS 的了解,这应该符合要求

于 2008-09-18T15:36:02.860 回答