2

在我的标题 div 中,我需要有 2 个向右浮动的对象,一个是按钮,另一个是搜索字段。

它们都在一个名为“pull-right”的 div 中,它只是让它们向右浮动。

对象按以下顺序排列(从左到右)

搜索框按钮

但是,由于它们显然都向右浮动,因此代码中的第一个元素将获胜并占据右侧的位置。

所以我把按钮放在了搜索框之前,尽管搜索框实际上是第一个出现的。但它仍然有效。

它被认为是一种草率的做法吗?

这是HTML:

<div id="navbar">
  <div id="navbar-inner" class="clearfix">
    <div class="pull-right">
      <a href="#" class="btn lightgrey">Sign in</a>
   </div>

   <div class="pull-right">
     <form><input type="search" id="search" placeholder="Search"></form>
   </div>
  </div>
  </div>

和CSS:

.pull-right { 
    float: right; 
}
4

1 回答 1

1

您可以轻松地将其包装在另一个容器中,然后将其浮动到右侧。

HTML:

<div id="floatingContainer">
    <input type="text" value="Input" />
    <input type="submit" value="submit" />
</div>​

CSS:

#floatingContainer { float:right; }​

JSFiddle 示例

于 2012-11-19T12:31:02.157 回答