html li的浮动问题

Question

我在这里有这个网站：http://dev.jmret.com/index.php但是我在内容页面上有一个问题，我有两个 var natives = process.binding('natives'); for (var key in natives) {if (key.indexOf('_') !== 0) {console.log(key);}} 在彼此之下，一个漂浮在它旁边。但它只漂浮在第二个旁边。我如何让我漂浮在第一个<li>旁边？

所以它看起来像这样。 CSS（我目前正在使用的）：

<li>

所以我需要做的就是让3 .sub-info { display: inline-block; position: relative; width: 67%; margin-bottom: 25px; margin-right: 1%; padding-left: 3%; float: none; } .sub-info2 { display: inline-block; position: relative; width: 26%; margin-bottom: 25px; /* margin-right: 1%; */ float: left; /* padding-right: 5%; */ padding-left: 1%; } 堆栈正确，我怎么能在css中实现呢？

非常感谢

Answer 1

这是因为包含正确列的ul包含display: block;。

更改为display: inline-block;上ul的{​​{1}}，并移除.sub-info2上的width。

像这样（内联样式，但你会得到重点）：

.sub-info2

Answer 2

你必须将你的ul包装成一个div，然后让它浮在它旁边。首先将css更改为：

.sub-info {
    display: inline;
    position: relative;
    width: 95%;
    margin-bottom: 25px;
    margin-right: 1%;
    padding-left: 3%;
    float: left;
}

然后在li.body-section中，将前两个ul打包成div，并将最后ul留在外面，如下所示：

<div class="wrapper">
   <ul></ul>
   <ul></ul>
</div>
<ul></ul>

并添加css：

.wrapper {
   float : left;
}

我相信你想要这样的东西：