CSS pour un menu (couleur puce,border...)

  • Auteur de la discussion Auteur de la discussion Skycer666
  • Date de début Date de début
WRInaute discret
Bonjour tout le monde,

je suis en train de réaliser un site web et je suis dans l'élaboration de mon menu.
Je n'arrive pas à faire certaines choses.

1- comment faire pour que le border d'une liste aille jusqu'à la puce :
exemple : ______________
* Accueil

2- comment faire pour entourer son menu d'un border top et bottom :
exemple : ______________
* Accueil
______________
* Présentation
______________
* Truc
______________

Ici il y a une barre en haut et en bas...

3- comment faire pour que lorsqu'un utilisateur se trouve sur une page, dans le menu cette page est d'une couleur différente.

Merci pr vos réponses

FF
 
WRInaute passionné
Skycer666 a dit:
3- comment faire pour que lorsqu'un utilisateur se trouve sur une page, dans le menu cette page est d'une couleur différente.

ca tu codes en php le nom de ta classe css différente suivant ta page et tes couleurs ...
 
WRInaute passionné
bah pour chaque page que tu as tu attribut une classe différente à ton menu dans ton header
exemple :
Code:
<ul>
    <li class="home<?php if($_SERVER['PHP_SELF'] == '/index.php') echo '_select'; ?>"><a href="/">accueil</a></li>
    <li class="home<?php if($_SERVER['PHP_SELF'] == '/page_1.php') echo '_select'; ?>"><a href="page_1.php">Page 1</a></li>
  </ul>
 
WRInaute discret
et Pour le reste des idées

Je pensais a list-style-position:inside; pour la 1 mais ss IE 6 biensur ça marche pa c tt moche
 
WRInaute passionné
Vouloir faire du CSS avec IE6 c'est comme essayer de marquer des buts à Fifa 09 avec Piquionne...
 
WRInaute discret
:) Très belle allégorie.

Ceci dit ça m'aide pas Tellement :)

Mon gros problème c'est l'alignement des puces (qui sont des images grace à list-style-image) sous IE6 qui ne pose pas de probleme sous Firefox...
Les puces sont toutes décalés vers le haut à partir du moment ou je mets un list-style-position:inside...


En espérant que quelqu'un vienne à mon secours
 
Nouveau WRInaute
Bonjour,

Pour l'alignement correct des puces, voir ici (seconde technique) http://css.mammouthland.net/puces_en_gifs.php

Pour les bords, attribue une classe pour ton dernier item genre :
Code:
<ul>
 <li>Accueil</li>
 <li class="der">truc</li>
</ul>

et pour le CSS associé :
Code:
li {
border-top:1px solid black;
}
li.der {
border-bottom:1px solid black;
}

Ainsi tous tes items auront un bord au dessus, et seul le dernier aura aussi un bord en dessous pour donner une apparence homogène.
 
Discussions similaires
Haut