Menu horizontal descendant - largeur de colonne (Page 1) / Le site: tuto-fr.com / Forum d'entraide: tuto-fr.com

Annonce

Visitez la boutique Wifi-highpower.com, votre revendeur agr Alfa Network: du matriel Wifi slectionn, cartes Wifi USB Awus036h et Awus036nh, antennes omnis, yagis, panel, amplis wifi, accessoires...

#1 05-11-2006 15:16:09

demonlight
Membre
Inscription : 05-11-2006
Messages : 1

Menu horizontal descendant - largeur de colonne

Bonjour,

Tout d'abord, merci pour le tuto sur les menus descendants, ça m'a pas mal aidé pour mon menu... wink

J'ai cependant encore un petit problème : la taille de mon menu descendant n'est pas adaptée et si j'augmente la largeur, le menu se place sur 2 lignes. hmm

J'avoue ne pas trop comprendre la dernière partie du tuto sur les différentes tailles de menu

Avez-vous une solution ???

Merci

J.

Ci-dessous le code de ma page :

<head>
<style type="text/css" media="screen">
<!-- 
body {behavior: url(csshover.htc);}
div#txt_menu a {color:#000000}
/* on enleve la taille de ul et la bordure*/
div#txt_menu ul {padding: 0;margin:0px; background: white}
div#txt_menu ul a:hover {color:#FFCC00;font-weight:bold}
div#txt_menu ul ul a:hover {background: #9ab2cb;color:#FFCC00;font-weight:bold}

/* float left pour les li afin d'aligner le menu et plus de bordures*/
div#txt_menu ul li {position:relative; list-style: none;float:left}

/* le décalage n'est plus a gauche maintenant mais en bas on annule donc le decalage a gauche et la correction en haut et on place la restriction de taille*/
div#txt_menu ul ul {position: absolute;display:none; width:100px;background: #C2D1E1}

/* plus de bordure et taille remise a 100px*/
div#txt_menu li a {text-decoration: none; padding: 4px 0 4px ; display:block; width:100px}
div#txt_menu ul.niveau1 li.sousmenu:hover ul.niveau2 {display:block;}


.lien1 a:link {color:#000000;font-weight:bold;text-decoration:none; font-size: 14px;}
.lien1 a:visited {color:#000000;font-weight:bold;text-decoration:none; font-size: 14px;}
.lien1 a:active {color:#FFCC00;font-weight:bold;text-decoration:none; font-size: 14px;}
.lien1 a:hover {color:#FFCC00;font-weight:bold;text-decoration:none; font-size: 14px;}

-->
</style>
</head>
<body>
<div id="txt_menu">
  <ul class="niveau1">
    <li><a href="accueil.html">Accueil</a></li>
    <li class="sousmenu"><a href="accueil.html">Particuliers</a>
      <ul class="niveau2">
        <li><a href="Depannage_Particulier.html">Dépannage informatique à domicile</a></li>
        <li><a href="Internet_Particulier.html">Installation Internet</a></li>
        <li><a href="Installation_Particulier.html">Installation de PC</a></li>
        <li><a href="Périphériques_Particuliers.html">Installation de périphériques</a></li>
        <li><a href="Reseau_Particulier.html">Réseau familial</a></li>
        <li><a href="Portable_Particulier.html">Réparation ordinateur portable</a></li>
        <li><a href="Sauvegarde_Particulier.html">Sauvegarde informatique</a></li>
        <li><a href="Formation_Particulier.html">Formation à domicile</a></li>
        <li><a href="Nettoyage_Particulier.html">Nettoyage de disque</a></li>
        <li><a href="Recuperation_Particulier.html">Récupération de données perdues</a></li>
        <li><a href="Mdp_Particuliers.html">Mot de passe perdu</a></li>
      </ul>
    </li>
    <li class="sousmenu"><a href="accueil.html">Professionnels</a>
      <ul class="niveau2">
        <li><a href="Depannage_Professionnel.html">Dépannage informatique PME, TPE</a></li>
        <li><a href="Portable_Professionnel.html">Réparation ordinateur portable</a></li>
        <li><a href="Maintenance_Professionnel.html">Maintenance informatique PME, TPE</a></li>
        <li><a href="Internet_Professionnel.html">Installation Internet</a></li>
        <li><a href="Installation_Professionnel.html">Installation de PC</a></li>
        <li><a href="Peripheriques_Professionnel.html">Installation de périphériques</a></li>
        <li><a href="Assistance_Professionnel.html">Assistance réseau informatique</a></li>
        <li><a href="Sauvegarde_Professionnel.html">Sauvegarde de données</a></li>
        <li><a href="Formation_Professionnel.html">Formation informatique</a></li>
        <li><a href="Nettoyage_Professionnel.html">Nettoyage de disque</a></li>
        <li><a href="Récuperation_Professionnel.html">Récupération de données disques</a></li>
        <li><a href="motdepasse_Professionnel.html">Récupération de mot de passe</a></li>
      </ul>
    </li>
    <li class="sousmenu"><a href="tarifs.html">Tarifs</a>
      <ul class="niveau2">
        <li><a href="tarifsPart.html">Particuliers</a></li>
        <li><a href="tarifsPro.html">Professionnels</a></li>
      </ul>
    </li>
    <li><a href="mailto:[email protected]">Contact</a></li>
  </ul>
</div>
</body>

Hors Ligne

Annonce

Visitez la boutique Wifi-highpower.com, votre revendeur agr Alfa Network: du matriel Wifi slectionn, cartes Wifi USB Awus036h et Awus036nh, antennes omnis, yagis, panel, amplis wifi, accessoires...

Sujets similaires