Quelle est la bonne façon de bootstrapfaire flotter un div vers la droite? Je pensais que pull-rightc'était la méthode recommandée, mais cela ne fonctionne pas.

@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>

Vous avez deux divs span6 dans votre ligne, ce qui prendra les 12 travées entières dont une ligne est composée.

L'ajout de pull-right à la deuxième div span6 ne va rien y faire car il est déjà assis à droite.

Si vous voulez dire que vous voulez que le texte du deuxième div span6 soit aligné à droite, ajoutez simplement une nouvelle classe à ce div et donnez-lui la valeur text-align: right par exemple

.myclass {
    text-align: right;
}

METTRE À JOUR:

EricFreese a souligné que dans la version 2.3 de Bootstrap (la semaine dernière), ils ont ajouté des classes utilitaires d'alignement de texte que vous pouvez utiliser:

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

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

Faire flotter un div vers la droite pull-rightest la méthode recommandée, je pense que vous faites les choses correctement, il vous suffit peut-être d'utilisertext-align:right;

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

bootstrap 3 a une classe pour aligner le texte dans un div

<div class="text-right">

alignera le texte à droite

<div class="pull-right">

tirera vers la droite tout le contenu non seulement le texte

Cela fait l'affaire, sans avoir besoin d'ajouter un style en ligne

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

La réponse est en imbriquant un autre <div>avec la classe "pull-right". Combiner les deux classes ne fonctionnera pas.

<p class="pull-left">Text left</p>
<p class="text-right">Text right in same line</p>

Ce travail pour moi.

edit: Un exemple avec votre extrait:

@import url('https://unpkg.com/[email protected]/dist/css/bootstrap.css');
 .container {
    margin-top: 10px;
}

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

Vous pouvez attribuer le nom de la classe comme centre de texte, gauche ou droite. Le texte s'alignera en conséquence sur ces noms de classe. Vous n'avez pas besoin de créer un nom de classe supplémentaire séparément. Ces classes sont intégrées dans BootStrap 3 et bootstrap 4.

Bootstrap 3

Documentation sur l'alignement du texte v3

<p class="text-left">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-right">Right aligned text.</p>
<p class="text-justify">Justified text.</p>
<p class="text-nowrap">No wrap text.</p>

Bootstrap 4

Documentation sur l'alignement du texte v4

<p class="text-xs-left">Left aligned text on all viewport sizes.</p>
<p class="text-xs-center">Center aligned text on all viewport sizes.</p>
<p class="text-xs-right">Right aligned text on all viewport sizes.</p>

<p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
<p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p>
<p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p>
<p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>