28220 sujets

CSS et mise en forme, CSS3

[Brocolisé (Résolu)] Une scrollbar sortie de je ne sais où

Modérateur
Salut tout le monde,

J'ai un petit soucis là... Non! pas sur IE mais sur FF et Opéra...

En fait, j'ai une scrollbar tout en bas qui apparait alors que ma mise en page reste pourtant centrée au sein de la fenêtre et que visiblement, aucun contenu n'est placé en dehors...

Pour tout dire, je n'ai aucune idée de ce qui génère ce pin's. C'est pas très cool cette blague...

Smiley help me please... Je suis dans le brouillard... Smiley confused

Site
Feuille css

Merci d'avance...
Modifié par koala64 (25 Jul 2005 - 07:21)
Tu utilises que des positions absolue ? Alors que ton site propose un flux naturel de haut en bas. C'est ton choix, mais essaye de refaire un conteneur defini en % ou en px si tu veux, et y mettre dedans d'autres div. Smiley cligne

Je te dis ca en y ayant jeter un vif coup d'oeil, je dois retourner bosser un peu aussi sur mon site ^^
Modifié par Wildry (25 Jul 2005 - 00:17)
Modérateur
??! celà ne m'a jamais posé de problème... Le positionnement absolu sert à centrer le conteneur... D'autre part, je ne vois pas le rapport entre le positionnement absolu et définir le conteneur en % ou px... çà manque de clarté là... Mes dimensions sont d'ailleurs en px...
Modifié par koala64 (25 Jul 2005 - 02:22)
Modérateur
Bah là je pêche... Après deux heures et demi de recherche, je n'y arrive pas... Vu que çà se produit sur toutes les pages, çà doit venir des éléments communs à celles-ci ( conteneur global, titre, menu, pied de page ) mais même en sachant çà, c'est le grand vide... Non, vraiment, je capte pas... Smiley ohwell
J'avais d'abord soupçonné ce fichu centrage par les marges négatives, qui a facilement des effets de bande, ou le masquage de texte avec text-indent, que tu utilises à la louche. Dommage qu'ils n'y soient pour rien, ça m'aurait permis de dire tout le bien que je pensais de ces deux bidouilles. .. Hélas, ils sont innocents sur ce coup-là Smiley ravi

Le vrai coupable est en fait ton #plan et son déplacement vers la droite en position relative.

Le voici, réduit à sa plus simple expression :

#document {
border: 1px solid;
}
#plan {
position: relative;
left: 388px;
border: 1px solid red;
}

et en HTML:

<body>
   <div id="document">
      <p id="plan">Plan</p>
   </div>
</body>


Ton plan (ici un simple paragraphe) occupe par défaut toute la largeur disponible dans son conteneur. Puis la position relative le fait glisser vers la droite de 388px... Mais il garde sa largeur calculée avant ce déplacement : pour couvrir tout le canevas qui vient de s'élargir de 388px, le navigateur fait apparaître une barre de scroll.

La gestion déffectueuse des calculs de largeurs dans IE fait qu'on ne voit pas de scroll dans ce navigateur.

Pour résoudre le problème, il faut que tu utilises un autre moyen d'aligner ce #plan sur la droite, ou que tu utilises un display:inline sur ce #plan pour que sa largeur calculée se ramène à celle de son contenu.
Modifié par Laurent Denis (25 Jul 2005 - 07:11)
Modérateur
Aaaah... Je te tire mon chapeau sur ce coup là... J'aurais eu beaucoup de mal à trouver çà tout seul...

Merci beaucoup Smiley ravi
Sujet clos
Aller à