CSS flotter à gauche et à droite dans le paragraphe avec span?

Question

Jusqu'à présent, quand j'avais une ligne avec l'exemple

précédent --- largeur de page --- suivante

J'ai utilisé un div conteneur avec 2 enfants, flotteur de style: gauche & float: right

Je suis pense qu'il pourrait être fait à partir d'une ligne de paragraphe avec peut-être de quelque chose comme SPAN:

<p><span class="s-left">previous</span><span class="s-right">next</span></p> 

J'ai essayé CSS avec:

span.s-left { text-align: left; } 
span.s-right { text-align: right; } 

mais qui ne le fait pas ..

Answer 1

C'est parce que span est par défaut affiché inline, donc il n'a pas la largeur définie pour que le texte soit aligné dans (qui est une description très lâche, mais ça va faire pour le moment).

Si vous voulez avoir droite et à gauche du texte aligné ce n'est pas beaucoup plus difficile, il suffit:

p { 
text-align: right; 
} 
span.s-left { 
float: left; 
} 

Une démonstration se trouve à JS Bin