右侧浮动的同一行上的输入和按钮

时间:2016-07-13 23:57:12

标签: html css html5 twitter-bootstrap css3

我没有找到任何方法让按钮和输入在同一行中浮动右.. 输入应位于右侧,按钮位于左侧,右侧浮动。 我找到的唯一的东西是右侧的按钮和左侧的输入或者按钮附加到页面的左侧..

2 个答案:

答案 0 :(得分:1)

如果你想要将它们正确地浮动,你需要更改按钮和输入的DOM顺序。

HTML -

<div>
  <input type="text" class="float-right">
  <button class="float-right">Submit</button>
</div>

CSS -

.float-right {
  float: right;
}

See the codepen here

答案 1 :(得分:0)

您可能需要提供更多信息才能获得一些帮助。如果您使用的是Bootstrap,那么有几个类可用于完成各种布局解决方案,但我认为更多信息(以及bootply,或codepen或jsfiddle)会有所帮助。

但是如果你使用bootstrap,这里是如何使用Bootstrap中的现成类来影响按钮相对于输入的一面:

http://www.bootply.com/NbDYNuEwGV