Comment augmenter correctement la hauteur de l'en-tête ?

Soutien
1

Bonjour,
J’aimerais augmenter la hauteur de l’en-tête :
image
Afin d’afficher un logo plus grand (l’en-tête conserverait sa hauteur par défaut sur mobile).

J’ai fait quelques essais, mais je n’y suis pas parvenu, car augmenter la hauteur (et la marge supérieure du contenu situé en dessous, pour que l’en-tête ne le recouvre pas avec sa hauteur accrue) provoquait un dysfonctionnement de la fonction de fixation. Cela empêchait le défilement ou faisait « sauter » le contenu.

Existe-t-il une méthode appropriée pour augmenter la hauteur de l’en-tête sans rien casser ?

2

Avez-vous essayé d’ajuster

#main-outlet {
    padding-top: 5.8572em;
}

Par exemple

.d-header {
    height: 8em;
}
#main-outlet {
    padding-top: 9.8572em;
}

844×427 13.8 KB

836×377 16 KB

3

Oui, je l’ai fait. Je dois préciser que je souhaite que l’en-tête ait environ deux fois la hauteur de la taille d’origine, tout en conservant la hauteur par défaut lorsqu’il est épinglé (ce qui pourrait être le problème principal).

4

Eh bien, j’ai réussi à le faire.
Je ne sais pas pourquoi j’ai rencontré de tels problèmes de blocage… Il y a encore un peu de saccade, mais ce n’est que de quelques pixels, donc vous ne le remarquerez pas sauf si vous défilez extrêmement lentement.
J’ai également du contenu personnalisé au-dessus de l’en-tête, ce qui a peut-être joué un rôle dans le problème que j’ai rencontré.