Ancres et position:fixed [Résolu]

Bonjour, comme beaucoup je tente d'être original via l'utilisation de position:fixed, pour ma part sur un header centré.

Par ailleurs, je souhaite mettre en place des ancres dans une page assez longue.

Je pense que le problème est connu mais même après moultes recherches je n'ai pas su trouver de solution.

Voici un exemple concret du problème: http://blo4r.free.fr/ancres-et-position-fixed.html.

J'ai tenté pas mal de choses, sous FF dans un premier temps, avec margin et/ou padding sur le body et autres divs, mais ... nada, que dale ... .

Une idée/solution ? Abandonner l'idée d'un header fixed ?
Modifié par bLo4r (19 Oct 2009 - 16:36)

Bonjour,

Quel est exactement le problème ?

(Pour moi tout semble OK, mais IE6 ne comprenant pas position:fixed, il se peut que cela fausse le test)

bonjour, en effet je n'ai pas ie6 et quelque part, c'est vrai que du point de vue des navigateurs, il n'y a pas de problèmes. ils font ce que je leur demande.

Mais du point de vue des futurs utilisateurs de ces ancres j'ai peur qu'il soient quelques peu déroutés par le fait que le texte passe sous l'élément positionné, non ?

En fait ce que je souhaiterais c'est que l'ancre ne fasse pas scroller le contenu jusqu'en haut de la page, ou autrement dit pas sous l'élément positionné via position:fixed; d'une manière ou d'une autre.

Existe-t-il un moyen de tromper le navigateur pour éviter cela ?
Modifié par bLo4r (19 Oct 2009 - 16:37)

Salut,

Tu peux tenter un :

h2
{
   padding-top:5em;
}

Ou quelque chose d'équivalent.

bLo4r a écrit :
utilisation de position:fixed (...) sur un header

Voilà l'erreur. C'est à la fois une erreur technique (ça cause les problèmes que tu rencontres), et très probablement une erreur ergonomique (restreindre l'espace disponible pour les contenus, en toutes circonstances, de la hauteur de ton header... il faut vraiment que le header soit une barre d'outils utile en permanence pour l'utilisation et la consultation du site).

bLo4r a écrit :
Abandonner l'idée d'un header fixed ?

Voilà une idée qu'elle est bonne.

Bon ben en fait j'ai trouvé une soluce !

Pas trés "catho" mais ca marche sur les dernières versions de FF, chrome, Safari, ie8.

En fait il suffit de compenser la hauteur de l'élément positionné en fixed, via un padding égale a la hauteur de l'élément fixed, puis utiliser un margin négatif pour corrigé le visuel.

Ça donne ca http://blo4r.free.fr/ancres-et-position-fixed-resolu.html.

On va dire que ce toupique est résolu !

ps: resultats sur browsershot http://browsershots.org/websites/2550734/
Modifié par bLo4r (20 Oct 2009 - 00:51)