28173 sujets

CSS et mise en forme, CSS3

Alignement de textes bête

Bonjour,

j'ai eu à faire des choses bien plus complexes mais je bloque sur une mise en forme simple :

Sur une même ligne il y a deux textes, l'un devant être aligné à gauche, l'autre à droite.

J'ai utilisé les balises <ul> et <li> mais les textes ne sont pas sur la même ligne.

Quelqu'un peut m'éclairer ?

Merci. lulu.
ce ne serait pas plus facile d'employer un tableau comprtant deux cellule?
avec dans tes <td> l'alignement du texte soit gauche etc...
Hello lulumOriss,

Tu n'aurais pas un bout de code HTML type, pour savoir avec quelle base tu travailles ?
Les deux éléments à aligner à gauche et à droite, c'est au sein d'un même li dans une liste non ordonnée ?
Oui effectivement, c'est pas simple de se faire une idée.
Voilà le code :

<div id="entete">
  <ul>
    <li class="titre">Titre</li>
    <li class="btFermer"><a href="#">Fermer</a></li>
  </ul>
</div>


Mais, effectivement, je peux peut-être utiliser une même ligne et deux <span>. Je vais essayer.
<div id="entete">
  <ul>
    <li class="titre">Titre</li>
    <li class="btFermer"><a href="#">Fermer</a></li>
  </ul>
</div>


li.titre {width: 70%; float: left; clear: left;}
li.btFermer {width: 20%; float: right;}


Et voilou.
Bonjour,
@mpop > Mais pourquoi clear:left ?

@lulumOriss > Tu peux utiliser aussi float:left pour le premier et text-align:right pour le second
Alan a écrit :
@mpop > Mais pourquoi clear:left ?

Ben en fait avec le code que j'ai donné c'est pas nécessaire. Avec des éléments moins large (et donc la possibilité d'en caser trois dans une largeur), ça serait indispensable.
Ok. Merci pour le coup de main.
J'étais parti sur ça :

<div id="aideEntete">
  <span class="titre">Titre</span>
  <span class="btFermer"><a href="#">Fermer</a></span>
</div>


avec un float:left pour le style .titre et un float:right pour le style .btFermer

Ça fonctionne mais je vais me pencher sur ton code.

Merci encore. lulu.
Sujet clos
Aller à