web-dev-qa-db-fra.com

"Le contenu est plus large que l'écran", même si je ne peux pas le reproduire localement et que le débordement de X est masqué.

Impossible de corriger l'erreur Google Mobile Ergonomie> Contenu plus large que l'écran de la console de recherche Google. J'ai essayé chrome émulateur de disposition mobile de DevTools, définissez une largeur de 320 pixels, mais aucun défilement horizontal ne s'affiche. Donc, tout semble bien dans l'émulateur, mais Google soulève une erreur. Ensuite, j'ai ajouter au CSS:

@media screen {
  html, body {
    width:      100%; 
    overflow-x: hidden;
  }...

Mais pas d'effet, l'erreur persiste encore.

L'outil Test Live URL ne montre aucune erreur, toutes les pages sont conviviales pour les mobiles.

Une idée comment résoudre ce problème? Je suis sûr que c'est un bug de Google, mais comment l'éviter?

google-search-consoleweb-developmentcssmobile
5
LeonidMew

J'ai supprimé tous les "position: absolute" des classes. Mais ces classes étaient affectées au contenu caché, ce qui convenait parfaitement au plus petit écran de smartphone, et la plupart d’entre elles n’étaient connectées à aucun élément de page, car les éléments étaient protégés par mot de passe.

J'ai trouvé un moyen d'accélérer le rendu des pages sans attendre longtemps après avoir cliqué sur "demander l'indexation". Tout d’abord, créez une nouvelle page en utilisant les modèles de site et les CSS, le texte de la page doit être unique (aide de Lorem Ipsum Generator). Deuxièmement, créez un fichier sitemap supplémentaire avec une seule URL pointant vers un nouveau fichier, envoyez-le et, en 5 minutes, vous aurez exploré et indexé la page. Cela aide beaucoup lors de la recherche d'un bogue dans template ou css.

Edit: le bogue dans position: absolute; même avec width: 220px; fait que la console de recherche Google trouve une erreur dans la page. La solution consiste à supprimer position: absolute et à le configurer à nouveau avec javascipt. Dans mon cas, il s’agissait de dialogues contextuels, et javascript a été pris en compte pour l’élever de toute façon. Ce javascript doit prendre en compte la taille de la fenêtre.

4
LeonidMew