[Résolu]Positionnement des éléments d'un menu

Bonjour tout le monde,

Je suis à nouveau confronter à un problème pour eviter d'utiliser un tableau dans une <div> pour que mon menu ou tout autre partie de mon site soit avec une bordure "spéciale".

Voila le problème : http://www.site-v1.estevolution.fr/
- Sous Firefox : +/- aucun probleme, mais bon j'ai du rusé, je voulais utiliser position:inherit; pour que je puisse placer les 3 <div> qui composent le menu à partir de la <div> contenant le menu complet. A la place de cette methode, j'ai essayer de faire un mic mac en jouant avec la propriété float avec la position en mode relative.

- Sous IE7 : Mon menu ne s'affiche pas comme il le faut, la partie droite du menu principal est allé je ne sais ou.

Pouvez-vous m'aider s'il vous plait à résoudre ce problème qui m'empeche d'avancer car je ne veux plus utiliser de tableau ?

Je vous remercie d'avance pour votre aide

Code HTML :

<DIV id="menu_principal">
      <DIV id="gauche"></DIV>
      <DIV id="centre">Menu Principal</DIV>
      <DIV id="droite"></DIV>
  </DIV>
 

CSS :

#menu_principal {
position:absolute;
top:145px;
left:220px;
width:713px;
height:34px;
}

#menu_principal #gauche {
position:relative;
top:0px;
left:0px;
width:13px;
height:34px;
background:url(Images/menu_gauche.png);
z-index:2;
float:left;
}


#menu_principal #centre {
position:relative;
top:0px;
left:0px;
width:674px;
height:34px;
background:url(Images/menu_bg.png);
line-height:32px;
z-index:2;
float:left;
}
#menu_principal #droite {
position:relative;
top:0px;
left:687px;
width:13px;
height:34px;
background:url(Images/menu_droite.png);
z-index:2;
}
 

Modifié par kiki57 (21 Aug 2007 - 17:54)

Bonjour kiki57 et bienvenue sur Alsacreations,

D'une manière générale, les conteneurs html (div ou autre) sont destinés à contenir ... du contenu, non à permettre l'incorporation d'un élément de style via CSS.

En d'autres termes, on applique un style en CSS sur un élément html existant, lequel peut-être un div de structure, c'est à dire englobant un ensemble de blocs (c'est à dire un ensemble de balises HTML).

Tout cela pour dire que la technique généralement employée pour faire une bordure à un site est d'appliquer en fond d'un conteneur principal (body, par exemple) une image de toute la largeur.

Les choses se compliquent lorsque le site est extensible : il faut alors un peu ruser en utilisant le contenu existant pour les angles ...

Je te conseille donc de penser d'abord au contenu de ton menu et à sa construction html avant de penser au design.
Une fois le contenu en place, il sera plus facile et plus sain d'étudier la meilleure façon d'intégrer le design que tu souhaites.

Merci Vero d'avoir répondu et de m'avoir donné ces indications

En ayant un peu plus détaillé ce que je voulais mettre dans mon menu, je suis retombé sur une solution qui est dans un tutoriel sur les menu en css, mais cette fois-ci je suis allé jusqu'au bout et j'ai enfin compris comment ca fonctionnait tout ça, donc je vais faire ce menu et je vais créer une image fixe pour le fond du menu, pour ce qui est du menu pouvant être ajustable, je le ferai en javascript je crois

En tout cas merci pour l'aide

PS : [RESOLU]

kiki57 a écrit :
PS : [RESOLU]

Hello,

Le [résolu] est un acte à faire par toi-même (relire les Règles ou la FAQ)

Merci d'avance

Oula désolé,

J'ai pas lu en intégralité et je pensais que seul les modérateurs pouvaient changer cela

Je le saurai pour la prochaine fois