CSS右对齐错误的顺序

Question

考虑使用HTML。我想将第一个li项对齐到左侧，将最后两个对齐到右侧。但是，将右对齐设置为最后两个会将中间li置于最右侧，将最右侧li置于中间。我该如何修理此订单？

HTML：

<ul>
    <li class="one">left</li>
    <li class="two">right</li>
    <li class="three">right last</li>
</ul>

CSS：

ul{
    width: 100%;
    overflow: hidden;
}

ul li{
    float: left;
}

ul li.two,
ul li.three{
    float: right
}

Answer 1

您可以使用display:inline-block来对齐这些内容，然后使用width进行调整

​li{
   display:inline-block
}​

Answer 2

这种行为是正确的，因为你开始将中间的li对齐到右边，所以它是第一个被吸引到右边的。然后最后一个跟在右边。

在使用'float'时，我不知道如何使用两个不同的ul-tag。

Answer 3

您在"float: right"中定义的样式中缺少逗号。它应该是"float:right;"

试试这个

ul{
    width: 100%;
    overflow: hidden;
}

ul li{
    float: right;
    display: block;
    clear: both;
}

ul li.one{
    float: left;
}

如果问题仍然存在，请告诉我。