Html 向右浮动总是将div带到右下角

下面是我的代码示例：

我遇到的问题是一个具有类的div：

col r no-padding

在计算的css中，其计算结果如下：

.cols.two.alt > .col.r {
      padding: 0 10px;
      float: right;
      width: 27%;
}

---

为什么现在这个div位于右下角，而不是第一个ul旁边的顶部

这是因为您在HTML中放置元素的顺序。当您浮动一个元素时，它只相对于它后面的元素浮动，而不是相对于它前面的元素浮动。所以当你有这样的结构时：

<ul>
    <!-- stuff -->
</ul>
<div style='float: right;'>
    <!-- stuff -->
</div>

div将始终显示在ul的下面，因为这就是它们在HTML标记中的组织方式。如果希望div位于ul的右侧，则需要更改顺序：

<div style='float: right;'>
    <!-- stuff -->
</div>
<ul>
    <!-- stuff -->
</ul>

---

这将使div位于ul的右侧。永远记住，如果你是浮动内容，它必须在你想要它旁边的东西之前浮动。

你需要将这2个

分为1个
，右侧
当前与第2个
对齐，因为它们顺序错误；在html中，将浮动div置于
之前