IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Menu horizontal CSS


Sujet :

CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    Août 2012
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Août 2012
    Messages : 4
    Par défaut Menu horizontal CSS
    Bonjour,

    J'ai un problème avec mon menu horizontal en CSS qui me décale tout mon texte. Pourtant le code HTML est bien correct.

    Mon fichier style.css :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    body {
    	background-color:#f5f5dc; /*On définit la couleur de fond qui va être utilisée sur l'ensemble du site */
    	} 
    ul {
     padding:0;
     margin:0;
     list-style-type:none;
     }
    li {
     margin-left:2px;
     float:left; /*pour IE*/
     }
    ul li a {
     display:block;
     float:left;   
     width:100px;
     background-color:#f5f5dc;
     color:black;
     text-decoration:none;
     text-align:center;
     padding:5px;
     border:2px solid;
     /*pour avoir un effet "outset" avec IE :*/
     border-color:#DCDCDC #696969 #696969 #DCDCDC;
     }
    ul li a:hover {
     background-color:#D3D3D3;
     border-color:#696969 #DCDCDC #DCDCDC #696969;
     }
    Mon fichier index.html :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <link rel="stylesheet" type="text/css" href="style.css"> 
    ...
    <div>
    <ul>
    <li><a href="index.html">Accueil</a></li>
    <li><a href="catalogue.php">Catalogue</a></li>
    <li><a href="connect.php">Se connecter</a></li>
    <li><a href="contact.html">Contact</a></li>
    </ul>
    </div>

    J'ai ensuite une liste à puces avec <li></li> mais qui ne s'affiche pas, le texte n'est pas du tout aligné. D'où le problème peut t-il venir ? Merci.

  2. #2
    Membre Expert
    Avatar de rodolphebrd
    Homme Profil pro
    Indépendant
    Inscrit en
    Novembre 2012
    Messages
    2 336
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Indépendant
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2012
    Messages : 2 336
    Par défaut
    Bonjour:

    - un menu qui décale tout votre texte: quel texte (avant, après, à gauche...)?
    - une liste à puce qui suit: où est le code?
    Citation Envoyé par Derrick1
    D'où le problème peut t-il venir ?
    de plein de chose!
    - merci de mettre votre dans la balise de formatage dont l'icône est #

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Centrer le texte d'un menu horizontal CSS
    Par neaux dans le forum Mise en page CSS
    Réponses: 26
    Dernier message: 08/12/2012, 14h24
  2. Menu horizontal css + sous menu
    Par arsenik360 dans le forum Mise en page CSS
    Réponses: 6
    Dernier message: 26/07/2012, 23h51
  3. Menu horizontal en CSS et liste
    Par SYL666 dans le forum Mise en page CSS
    Réponses: 6
    Dernier message: 21/06/2006, 15h03
  4. menu horizontal css
    Par Bibouda dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 09/01/2006, 02h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo