浮动：右反转跨度的顺序

我有 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>

and CSS:

span.button {
    float:right;
}

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

在浏览器中，跨度以相反的顺序显示：导入导出设置。 我可以通过仅更改 CSS 文件并保持 HTML 不变来更改顺序吗？

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