浮动div从左到右的顺序向右? [英] Float div's to the right in left-to-right order?

查看:1012
本文介绍了浮动div从左到右的顺序向右?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有多个div,我想在水平行显示。通常,我这样做是为了简单地将它们浮动到右侧,并按照相反的顺序将它们放在标记中:

I have multiple div's I want to display in a horizontal row. Normally, the way I'd do this is to simply float them to the right and put them in the markup in reverse order like so:

<div>
  <div style="float:right">Right</div>
  <div style="float:right">Middle</div>
  <div style="float:right">Left</div>
</div>

我想完成一个类似的东西,float div的右边,但我不能在SEO原因的标记中颠倒他们的顺序。

I'm trying to accomplish a similar thing, float div's to the right, but I can't reverse their order in the markup for SEO reasons. The left div needs to be first in the code.

有没有一个简单的方法来做到这一点,而不诉诸定位的东西绝对?

Is there a simple way to do this without resorting to positioning things absolutely?

推荐答案

您可以将 text-align:right 应用于容器和 :inline-block 代替浮动:

You could apply a text-align: right to the container and a display: inline-block in place of the floating:

<div style="text-align: right">
  <div style="display:inline-block">Left</div>
  <div style="display:inline-block">Middle</div>
  <div style="display:inline-block">Right</div>
</div>

DEMO

DEMO

这篇关于浮动div从左到右的顺序向右?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆