Discussion :

[JefReb]

Bonjour,

Je rencontre un problème avec les points d'encrage.

Par exemple :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<a name="syn1"></a><h2>Définition d'un style</h2>

J'ai modifié mes pages de façon à ce qu'il y ait un bandeau fixe en haut de page avec le menu. Lorsque le contenu est plus grand que la fenêtre, elle passe donc derrière le bandeau qui est de 200px de haut.

J'ai donc une table des matières qui me permet d'aller directement à un point d'encrage :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<ul>
    <li><a href="#syn1">Définition d'un style</a></li>
    <li><a href="#syn2">Les sélecteurs de balise</a></li>
    etc.
</ul>

Le problème est que le point d'encrage se positionne tout en haut de la fenêtre et donc derrière le bandeau. Donc invisible.

Je n'avais pas ce problème évidemment lorsque mon bandeau n'était pas fixe.

Question :
Y a-t-il un moyen de positionner le point d'encrage de façon à ce qu'il apparaisse à disons 200px du haut de la fenêtre, c'est à dire après le bandeau ?

Merci à tous.

[rodolphebrd]

Bonjour,

je n'ai pas bien compris votre problème. Au début je pensais plutôt à un problème de Typo (encrage)

Peut-être qu'avec plus de code, des images avec le problème en question et l'effet souhaité ou une page en ligne on pourrait y voir plus clair...

[pipala]

Hello,

Tu peux utiliser du css et mettre un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

margin-bottom: 200px;

sur l'élément qui porte l'ancre.

Ainsi, ton h2 se situera à 200px sous l'élément qui porte l'ancre et sera visible sous ton menu.

[JefReb]

Merci pour vos réponses.
Je pense que la solution est plutôt du coté CSS et je vais tester la réponse de Pipala.

Difficile de mettre une page en ligne car je suis en plein reconstruction de mon site avec le bandeau fixe.
Je vais expliquer en images. Mais je pense qu'il y a une solution CSS. Sinon tant pis, je n'aurai plus de table des matières.

Exemple1 est la page qui s'ouvre: image1

Si je veux aller directement à Les sélecteurs de balise
je désire obtenir ceci: image2

Mais en fait j'obtiens: image3

Car Les sélecteurs de balise se retrouve derrière le bandeau

Merci à tous

[rodolphebrd]

Une page en ligne ou le code css et html, c'est mieux.

Et puis des images en pièces jointes car elles sont trop volumineuses

[pipala]

Et pour que le margin ne se fasse qu'au moment ou tu cliques sur le lien t'emmenant à l'ancre, il faut que tu utilises la propriétés css3 :target

Si tu pouvais joindre ton fichier html, il serait plus facile de t'aider