28172 sujets

CSS et mise en forme, CSS3

Bonjour,
J'ai un petit souci avec un menu vertical en css. Voici le lien http://menu.orgone-design.org/. Lorsque je redimmensionne le navigateur le contenu des liens ne se positionne pas au bon endroit. J'aimerais savoir, quelles modifications dois je apporter à la css ou au html pour résoudre ceci ?
Le code est dans la page Web.
Merci
Salut.

.conteneur {
  margin:auto;
  position:absolute;
  width:100%;
}

D'abord les elements en display block : .conteneur est un div, les <div></div> par defaut sont en display block donc en largeur il occupe déjà tout l'espace à sa dispo, et en hauteur s'adapte à son contenu. Donc width:100%; ne sert à rien ...
Ensuite les elements en position absolute : position:absolute; veut dire que ce block va se positionner par rapport au coin en haut à gauche de son premier parent en position:relative; ... .conteneur n'as pas de parent en relative (ou peut être le body, et de toute façon ce n'est pas ce que tu cherche à faire puisque tu n'indique pas non plus de left, top, right ou de bottom, donc ca ne sert à rien non plus.

Tu voudrais que contenu des liens se positionne juste à gauche des liens, soit exactement à gauche de ta div .left qui elle fait 20% de la largeur de .conteneur (ligne 59 de ton code).
Donc ce que tu peux faire c'est :

- utiliser ton .conteneur comme parent en postion relative :
.conteneur {
  position:relative;
}

- pour ensuite placer le contenu de tes liens à 20% du bord gauche de ce .conteneur (je pense que tu ajusteras à 18.5%) :
#nav-left :hover .sousmenutab {
  left:20%;
  top:20px;
}


Ceci dit pour ce genre de menu, je le ferrai plutôt en javascript (en pensant à la dégradation pour les clients qui ont désactivé le javascript).
Salut dhjapan,

Merci pour ta réponse. Il y a du mieux, mais les 18/20% sur la position du menu ne permet pas d'avoir une position précise. Il y a toujours un décalage si je redimensionne la page. Tu penses qu'on peut arriver à faire quelques de mieux ?

Merci