css - float :right reverses order of spans

Question

我有 HTML:

<div>
    <span class="label"><a href="/index/1">Bookmix Offline</a></span>
    <span class="button"><a href="/settings/">Settings</a></span>
    <span class="button"><a href="/export_all/">Export</a></span>
    <span class="button"><a href="/import/">Import</a></span>
</div>

和 CSS:

span.button {
    float:right;
}

span.label {
    margin-left: 30px;
}

在浏览器中，span 以相反的顺序显示:Import Export Settings。我可以通过仅更改 CSS 文件并保留 HTML 原样来更改顺序吗？

Answer 1

这个问题的一般解决方案是反转 HTML 中右侧 float 元素的顺序，或者将它们包装在包含元素中并将其 float 到右侧。