28220 sujets

CSS et mise en forme, CSS3

Bonjour,

J'aimerais savoir si quelqu'un pourrait m'expliquer comment positionner la 2nde ligne de texte. En effet, j'ai un menu composé de lien qui doivent parfois s'écrire sur 2 lignes de textes.

J'ai essayé plusieurs méthodes mais aucune ne fonctionne : si je change le padding-left, cela n'a aucun effet sur mon menu, et si je rajoute un margin-left, mes puces n'apparaissent plus au survol.

Voici mon code :
 .rubrique{                    /* définition des caractéristiques de la liste rubrique */
 list-style-type: none;
 float:right;
 padding: 1px 0 0 22px; 
 height: 237px;
 font-size:0.75em;
 }

 .rubrique a{
 display: block;               /* autorise l'écriture sur deux lignes si le lien dépasse la largeur autorisée */
 height: 1.58em;               /* interligne entre les liens */
 width: 176px;                 /* largeur du rectangle dans lequel doivent s'écrire les liens */
 color: #555;
 text-decoration: none;
 text-indent: 22px;
 }
 
 .rubrique a:hover{                /* aspect des liens qui se trouve dans la liste menu au survol  */
 background-image:url(img/puce.gif);
 background-position: left;
 background-repeat: no-repeat;
 color: #015;
 }


Si quelqu'un entrevoit une solution, elle serait la bienvenue.
Merci d'avance Smiley cligne
Modifié par Cygnus (10 Nov 2005 - 15:57)
Salut chankalan,

Je n'ai malheureusement pas encore de page en ligne, par contre, je peux te fournir la capture d'écran.

Voilà ce que j'obtiens en css : les 2nde lignes dans mon menu de navigation sont alignés sur le conteneur.
upload/3738-css.jpg

Voilà mon modèle de départ et ce que j'aimerais obtenir : les 2nde lignes sont alignées sur la 1ère ligne.
upload/3738-modele.jpg

J'espère que c'est maintenant plus clair. Smiley biggrin
Modifié par Cygnus (21 Oct 2005 - 09:58)
Bonjour Cygnus,

Supprime ton "text-ident" et remplace-le par un padding-left Smiley cligne
Modifié par g41687 (21 Oct 2005 - 10:31)