Qual è il modo corretto di bootstrapfar galleggiare un div a destra? Ho pensato che pull-rightfosse il modo consigliato, ma non funziona.

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

Hai due div span6 nella tua fila in modo da occupare tutti i 12 span di cui è composta una riga.

L'aggiunta di pull-right al secondo span6 div non farà nulla in quanto è già seduto a destra.

Se vuoi dire che vuoi che il testo nel secondo span6 div sia allineato a destra, aggiungi semplicemente una nuova classe a quel div e assegnagli l'allineamento del testo: giusto valore ad es.

.myclass {
    text-align: right;
}

AGGIORNARE:

EricFreese ha sottolineato che nella versione 2.3 di Bootstrap (la scorsa settimana) hanno aggiunto classi di utilità di allineamento del testo che è possibile utilizzare:

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

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

Far galleggiare un div sulla destra pull-rightè il modo consigliato, penso che tu stia facendo le cose nel modo giusto, solo che devi usaretext-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 ha una classe per allineare il testo all'interno di un div

<div class="text-right">

allinea il testo a destra

<div class="pull-right">

tirerà a destra tutto il contenuto, non solo il testo

Questo fa il trucco, senza la necessità di aggiungere uno stile in linea

<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 risposta è nel nidificare un altro <div>con la classe "pull-right". La combinazione delle due classi non funzionerà.

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

Questo lavoro per me.

modifica: un esempio con lo snippet:

@import url('https://unpkg.com/bootstrap@3.3.7/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>

Puoi assegnare il nome della classe come text-center, sinistra o destra. Il testo si allineerà di conseguenza con il nome della classe Non è necessario creare un nome di classe extra separatamente. Queste classi sono integrate in BootStrap 3 e bootstrap 4.

Bootstrap 3

v3 Documenti di allineamento del testo

<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

v4 Documenti di allineamento del testo

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