Balise H5 montrant différentes tailles entre les pages – Développement de thèmes WordPress

J’ai travaillé sur le développement d’un thème WordPress et je n’arrive pas à comprendre cela. Je zoome à 250% sur mobile, tout le texte d’en-tête est le même sur toutes les pages sauf une. Cette page affichée est bien plus grande que les autres, comme si elle avait déjà été agrandie. Une idée ?

Code pour zoomer sur mobile.

.site-header h5 {
font-size: 250%;
letter-spacing: 2px;
color: #3b3a36;
font-family: 'Russo One', sans-serif;
margin: 0;}

Div’s que j’utilise sur la même page.

.about-header {
width: 100%;}

.about {
display: flex;
width: 100%;
flex-flow: column wrap;}


.about1 {
width: 98%;
box-shadow: inset 0 0 8px 2px rgba(0,0,0,.75);
padding: 10px;
margin-bottom: 10px;}


.about2 {
width: 98%;
box-shadow: inset 0 0 8px 2px rgba(0,0,0,.75);
padding: 10px;
}

.about div:nth-of-type(1n+2) {
margin-left: 0px;
padding-bottom: 20px;
flex: 1;}

Le site Web que j’utilise pour tester mon thème est http://rockstarfrenchie.com/ et la page qui affiche une taille de police plus grande que toute autre page d’en-tête est http://rockstarfrenchie.com/about/.

N’oubliez pas que je n’ai ce problème que sur mobile, ce qui signifie que je fais un zoom avant sur le texte de 250 % quelque part, mais je n’arrive pas à le comprendre.

Merci d’avance pour votre aide.

Solution n°1 trouvée

Je pense avoir trouvé le problème et cela signifie que vous devrez apporter quelques modifications à votre CSS, mais au moins, les choses seront cohérentes dans tous les domaines.

Votre balise meta dans l’en-tête du document est erronée. Tu as:

<meta name="view port" content="width=device-width, initial-scale=1">

viewportest un mot. Changez-le en :

<meta name="viewport" content="width=device-width, initial-scale=1">