Position absolute ?

Bonjour,

Actuellement sur mon site Traduction russe il y a un menu horizontal positionné avec postion absolute. Actuellement la structure de la page est la suivante :

<div id="page">
....<div id="header"></div>
....<div id="navbar"></div>
....<div id="story">
........<div id="storymain"></div>
........<div id="side"></div>
....</div>
</div>

J'aimerais passer à :

<div id="page">
....<div id="header"></div>   
....<div id="story">
........<div id="storymain"></div>
........<div id="navbar"></div>
........<div id="side"></div>
....</div>
</div>

Le problème c'est que la barre horizontale "navbar" positionnée avec absolute, reste à sa place sous Firefox, mis vire sous IE. Y-a-t-il une solution, un hack ou qqch pour IE ?

Merci
Modifié par peremax (11 Mar 2005 - 16:39)

Bonjour,

J'ai essayé la transformation que tu indiques en partant de ton site, et là j'ai deux remarques :

- Le menu ne reste pas en place sous FF (logique puisqu'il change d'élément parent) il faut donc changer la valeur du "top" dans la CSS

- Sous IE j'obtiens bien le même rendu, pas de souci

Es-tu sure de toi ?

Oui, j'ai essayé et la barre de navigation disparait integralement sous IE avec la CSS suivante :

#navbar {
...width: 760px;
...height: 37px;
...background: #A4AEA3 url("../images/navbar.gif") no-repeat;
...position: absolute;
...top: -100px;
...left: 0px;
}

J'ai ouublié de préciser que j'ajoute un décalage négatif pour la deuxième possibilité.

Merci

Ok, je me suis aperçu qu'en rafraîchissant la page sous IE la barre disparaissait effectivement...

En y regardant de plus près, le contenu de "story" reste dans le flux, donc on peut arriver au résultat voulu en supprimant le positionnement de la "navbar" et en la plaçant alors en premier au niveau de l'html dans le div "story" (avant le div "storymain"). Après ça, quelques réglages de marges sont peut-être nécessaires...L'autre solution serait de positionner tous les éléments du contenu de "story"; je n'ai pas essayé mais ça doit fonctionner.

Qu'en dis-tu ?

Oui, merci pour ta réponse. En fait je change la position de la navbar car je veux que le texte de la page passe en premier. Je voudrais que les 300 premiers caractères de la page soient des caractères de texte, et ça pour les moteurs de recherche. Donc le navbar doit être pour moi après "storymain".

Par contre je ne sais pas comment positionner tous les éléments de story, je ne connais pas leur hauteur.

Sinon, ça marche en plaçant "navbar" juste avant la balise </body>, mais le problème c'est que ça fait pas une page "sémantiquement propre".