如何让我的 Twitter Bootstrap 按钮右对齐? [英] How can I get my Twitter Bootstrap buttons to right align?
问题描述
我这里有一个简单的演示:
I have a simple demo here:
<ul>
<li>One <input class="btn pull-right" value="test"></li>
<li>Two <input class="btn pull-right" value="test2"></li>
</ul>
我有一个无序列表,对于每个列表项,我希望左侧有文本,然后是右对齐按钮.我曾尝试使用右拉,但这完全弄乱了对齐方式.我做错了什么?
I have an unordered list and for each list item I wish to have text on the left and then a right aligned button. I have tried to use pull-right but this completely messes up the alignment. What am I doing wrong?
<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" />
<ul>
<li>One <input class="btn pull-right" value="test"></li>
<li>Two <input class="btn pull-right" value="test2" </li>
</ul>
推荐答案
在 class 属性中插入 pull-right
并让 bootstrap 排列按钮.
Insert pull-right
into the class attribute and let bootstrap arrange the buttons.
对于 Bootstrap 2.3,请参阅:http://getbootstrap.com/2.3.2/components.html#misc > 辅助类 > .pull-right.
For Bootstrap 2.3, see: http://getbootstrap.com/2.3.2/components.html#misc > Helper classes > .pull-right.
对于 Bootstrap 3,请参阅:https://getbootstrap.com/docs/3.3/css/#helper-classes > 辅助类.
For Bootstrap 3, see: https://getbootstrap.com/docs/3.3/css/#helper-classes > Helper classes.
对于 Bootstrap 4,请参阅:https://getbootstrap.com/docs/4.0/utilities/float/#responsive
pull-right
命令被移除并替换为 float-right
或一般替换为 float-{sm,md,lg,xl}-{左,右,无}
The pull-right
command was removed and replaced with float-right
or in general to float-{sm,md,lg,xl}-{left,right,none}
这篇关于如何让我的 Twitter Bootstrap 按钮右对齐?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!