Création
d'entreprise
Posez votre question Signaler

CSS:mettre une bordure dans un menu? [Résolu]

midiweb - Dernière réponse le 2 déc. 2007 à 09:39
salut, j'ai un menu très simple composé avec les élements d'une liste. Je voudrais mettre une bordure fine horizontale en pointillé entre chaque élement de ce menu, jusqu'à ma page principale du milieu. Il faudra aussi une espace régulier entre chaque entrée du menu et cette bordure. Je pourrais bien sûr utiliser un tableau et des cellules et la fonction Border. J'ai essayé mais ma mise en page est changée. Je voudrais, si possible, sans tableau.
Autre chose, comment met-on des liens en css?Je ne trouve pas la fonction, je veux dire, les couleurs changent en passant avec la souris sur les éléments du menu.
Voici mon code HTML suivi de la CSS.
<div id="menu" >
<ul>
<li>
<strong><a href="index.php?page=home">Home</a><br />
</strong>
</li>
<li>
<strong><a href="index.php?page=profil">Profil</a><br />
</strong>
</li>
<li>
<strong><a href="index.php?page=cout">Coûts</a> <br />
</strong>
</li>
<li>
<strong><a href="index.php?page=rubrique">Rubrique</a> <br />
</strong>
</li>
<li>
<strong><a href="index.php?page=info">Information</a> <br />
</strong>
</li>
<li>
<strong><a href="index.php?page=contact">Contact</a><br />
</strong>
</li>
<li>
<strong><a href="index.php?page=form">Formulaire</a><br />
</strong>
</li>
</ul>
</div>
ma page css:
div#menu {
position: absolute;
width: 107px;
height: 420px;
left: -18px;
padding-left:inherit;
margin-top: 130px;
top: 27px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000066;
}
Merci de votre aide.
A+
Lire la suite 

CSS:mettre une bordure dans un menu »

6 réponses
Réponse
+1
moins plus
Pour les lignes dessous et l'espacement :
li{
  border-bottom: 1px dashed #000;
  padding-bottom: 5px;
}


Pour les pseudo-classes :
ul{
  background-color: #0f0;
}
ul:hover {
  background-color: #f00;
}
Ajouter un commentaire
Réponse
+1
moins plus
pour ton css il ne faut pas mettre le div

voila ton css corrigé (mais qui n'est pas forcement le bon pour ce que tu veu faire)

#menu
{
position : absolute ;
width : 107px ;
height : 420px ;
left : -18px ;
padding-left : inherit ;
margin-top : 130px ;
top: 27px ;
font-family : Arial, Helvetica, sans-serif ;
font-size : 12px ;
color : #000066 ;
}
Ajouter un commentaire
Réponse
+0
moins plus
salut, merci, cela marche,sauf la largeur, j'ai ajouté widt:98px, qui est la largeur des lignes jusqu'a ma page principale.
Le hic, c'est que j'ai une deuxième liste dans mon texte du milieu, qui, lui ne doit pas être touché par cette propriété de bordure. Seul le menu a des bordures. ll faudrait une "css conditionelle", si j'ose dire.


li{
border-bottom: 1px dashed #000;
padding-bottom: 5px;
width: 98px
}

Je cherche encore.A+
Ajouter un commentaire
Réponse
+0
moins plus
eh bien ainsi :
#menu ul li{
    border-bottom: 1px dashed #000;
    padding-bottom: 5px;
    width: 98px
} 


Là : http://www.yoyodesign.org/doc/w3c/css1/index.html#contextual-selectors
Ajouter un commentaire
Réponse
+0
moins plus
salut moi je voudrai juste changer le contour des titres dans la bordure regardez http://wissem.blog4ever.com je veut les rendre comme en haut donc en style dotted svp pouvez vous m'aider?? merci
Ajouter un commentaire
Réponse
+0
moins plus
je voulait juste eclairer un point c'est la bordure de gauche et je veux modifier que article, photo, forum, newsletter, sondage, lien/partenaires, statistique donc juste la ou c'est en relief je le veux comme en haut en dotted merci encore pour votre futur reponse!
Ajouter un commentaire
Ce document intitulé « CSS:mettre une bordure dans un menu? » issu de CommentCaMarche (www.commentcamarche.net) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Dossier à la une
Passage au tout numérique : quel coût pour les particuliers ?