Se connecter / S'enregistrer
Votre question

[Résolu] Css border-bottom sur plusieurs lignes

Tags :
  • Arrière plan
  • Programmation
Dernière réponse : dans Programmation
20 Mai 2010 12:14:33

Bonjour,

Sur ma page j'ai une colonne sur la gauche qui permet d'afficher plusieurs titres les uns en dessous des autres, et séparés par un border-bottom.

le code css de ma bordure :
  1. #tree{
  2. padding:0px 10px 0 8px;margin:0;
  3. }
  4. #tree ul{
  5. color:#fff;padding:0 0 0 20px;margin:5px 0 5px 0;list-style-type:none;text-decoration:none;
  6. }
  7. #tree .parent0{
  8. background:#ce0000;color:#fff;font-size:13px;border-bottom:1px solid #fff;padding:2px 0 2px 5px;list-style-type:none;
  9. }


et le code pour chaque titre :
  1. <ul id="tree">
  2. <li class="parent0">
  3. <a class="parent0" href='"mon lien"</a>
  4. </li>
  5. </ul>


Mon problème est que dès que j'ai un titre un peu trop large, il s'affiche sur deux lignes et là ma bordure foire complètement. Du genre :
Mon titre trop grand sur
deux lignes

Un titre de taille normale

Est-ce que quelqu'un sait de quoi ça vient et comment régler ce problème ?

Merci!

Autres pages sur : resolu css border bottom plusieurs lignes

20 Mai 2010 15:30:22

Bon finalement j'ai trouvé une parade ^^

  1. #tree .parent0{
  2. background:#ce0000;color:#fff;font-size:13px;border-bottom:1px solid #fff;padding:2px 0 2px 5px;list-style-type:none;
  3. }
  4. #tree .parent1{
  5. background:#ce0000;color:#fff;font-size:13px;padding:0px 0 2px 0px;list-style-type:none;
  6. }
  7. #tree .parent0_active{
  8. background:#f5f5f5;color:#000;font-size:13px;font-weight:bolder;border-bottom:1px solid #fff;padding:2px 5px 2px 5px;list-style-type:none;
  9. }


et

  1. <ul id="tree">
  2. <li class="parent1">
  3. <div class="parent0"><a href='"mon lien"</a></div>
  4. </li>
  5. </ul>
m
0
l
20 Mai 2010 18:32:34

Bonjour,

Pourquoi faire une div dans un ul...?

  1. <ul>
  2. <li><a href="#">le lien</a></li>
  3. </ul>


  1. li {
  2. border-bottom: 1px solid #fff;
  3. }
m
0
l
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS