Twitter bootstrap float div right [英] Twitter bootstrap float div right

问题描述

在 bootstrap 中向右移动div的正确方法是什么？我认为 pull-right 是推荐的方式，但它不工作。

  @import url（'http://twitter.github.com/bootstrap/assets/css/bootstrap.css'）; .container {margin-top：10px;}  

  div class =container> < div class =row-fluid> < div class =span6> < p>左侧文字< / p> < / div> < div class =span6 pull-right> < p>文字右键< / p> < / div> < / div>< / div>  

解决方案

您的行中有两个span6 div，因此将占据整个12个span，即一行由组成。

到第二个span6 div不会做任何事情，因为它已经坐在右边。

如果你想要的文本在第二span6 div向右对齐，然后简单地添加一个新的clas到该div，并给它text-align：right value eg

  .myclass {
 text-align：right; 
} 
  
 
 
 
 
 
 
 UPDATE：
 
 
 
 EricFreese指出，在Bootstrap的2.3版本（上周）中，他们添加了可以使用的text-align实用程序类：
 
 
 
 
 
  .text-left  
 
 
  .text-center  
 
 
  .text-right  
 
 
 
 
 
  http://twitter.github.com/bootstrap/base-css。 html＃typography  
 
What is the proper way in bootstrap to float a div to the right? I thought pull-right was the recommend way, but it is not working.



@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
 .container {
    margin-top: 10px;
}

<div class="container">
    <div class="row-fluid">
        <div class="span6">
            <p>Text left</p>
        </div>
        <div class="span6 pull-right">
            <p>text right</p>
        </div>
    </div>
</div>



解决方案
You have two span6 divs within your row so that will take up the whole 12 spans that a row is made up of.

Adding pull-right to the second span6 div isn't going to do anything to it as it's already sitting to the right.

If you mean you want to have the text in the second span6 div aligned to the right then simple add a new clas to that div and give it the text-align: right value e.g.
.myclass {
    text-align: right;
}




UPDATE:

EricFreese pointed out that in the 2.3 release of Bootstrap (last week) they've added text-align utility classes that you can use:


.text-left
.text-center
.text-right


http://twitter.github.com/bootstrap/base-css.html#typography

                        
这篇关于Twitter bootstrap float div right的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！