Question

我正在使用选择框，我想将我的选择框设置为div的右侧..这是我的代码：

<div class="row">
  <div class="col-md-12">
    <div class="col-md-8">
      Some Text
    </div>
    <div class="col-md-4 text-right">
      <select class="selectpicker alibaba" id="graphdate">
         <option value="Daily">Daily</option>
         <option value="Weekly">Weekly</option>
         <option value="Monthly">Monthly</option>
      </select>
    </div>
  </div>
</div>

Answer 1

从行和列布局中，我假设您正在使用Bootstrap Grid布局。

要将元素右侧的元素与的子元素对齐，您只需将类pull-right添加到相关元素即可。

例如，在这种情况下，您可以将<select>标记更改为：

<select class="selectpicker alibaba pull-right" id="graphdate">

Answer 2

添加一些CSS，取决于你如何引用select元素，但基础在于：

select{
    float: right;
}

https://jsfiddle.net/51rhsnwa/

Answer 3

将班级pull-right添加到您的选择中。

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="row">
  <div class="col-md-12">
    <div class="col-md-8" style="border:1px solid red;">
      Some Text
    </div>
    <div class="col-md-4" style="border:1px solid blue;">
      <select class="selectpicker alibaba pull-right" id="graphdate">
           <option value="Daily">Daily</option>
           <option value="Weekly">Weekly</option>
           <option value="Monthly">Monthly</option>
        </select>
    </div>
  </div>

Answer 4

感谢所有回复..但我没有发现任何人的回答都有帮助。我试过这个，它解决了我的问题

<div class="col-md-offset-10 col-md-2 padding-left-0">
   <select class="selectpicker alibaba" id="graphdate">
     <option value="Daily">Daily</option>
     <option value="Weekly">Weekly</option>
     <option value="Monthly">Monthly</option>
   </select>
</div>

选择要对齐的框

4 个答案: