Chevauchement du texte avec Bootstrap 3 sur le mobile

Question

Si vous regardez this website dans les options de développement de Google Chrome, en particulier le bouton réactif mobile, il chevauchera ma section de portfolio au-dessus de ma section sur. J'ai essayé un certain nombre de correctifs potentiels sur Internet, comme changer "l'affichage" et "positionnement" dans CSS. Aucun de ceux qui ont travaillé.

En note, ce problème n'existe pas sur l'environnement local, seulement en direct.

Des suggestions?

P.S. Ceci est un site Web de portefeuille. Je n'essaie pas de solliciter mes informations. C'est juste cassé et semble mauvais sur le mobile. MERCI!

Answer 1

Eh bien, essayez de supprimer la règle height: 100%; des classes suivantes:

• .intro section
• .sur section
• .portfolio section

Cela résout le bug qui se chevauchent. Vous pouvez toujours ajouter une requête média pour réduire le padding-top de toutes les sections. Quelque chose comme ça:

@media all and (max-width: 580px) { 
    .about-section, .portfolio-section { 
     padding-top: 70px; 
    } 
} 

Espérons que cela peut vous aider.

Answer 2

Vous pouvez simplement enlever la hauteur: 100% du corps. Cela permettra au corps de déborder, et de ne pas coller à la hauteur maximale de la fenêtre.