2

The mobile friendliness tester is saying that my text is too small, and that clickable elements are too close together. I ensured that ALL text on the page was above 18 font to test, and Google still said it was not mobile friendly.

I think there's an issue fetching the site properly. On my site, the "screenshot" section takes up less than half the mobile preview, while on the other site (which passes mobile friendliness) it takes up the full preview.

Image for reference of the narrowness: Note the "screenshot" section, the page loads very narrow.

The url is Chromatin.net, running on Wordpress with Astra theme and default editor.

All of the resources on the page were loaded successfully according to the "more info" section.

1 Answer 1

0

I suspect that it is because your <body> element doesn't have a width set.

Try adding:

body {
    min-width: 100%;
}

If that doesn't change anything (despite poor it being poor practice):

body {
    min-width: 100% !important;
}

This is definitely a shot in the dark, but the way you solve this problem is by taking shots in the dark until something works. Look for things that don't have width applied, mess with different break points, make sure that you're breaking the box model anywhere, and make sure your html is well formed (w3 validator).

1
  • Thanks for the reply, I tried adding both of those and also adding to images and no luck unfortunately
    – Tman
    Jun 16 at 2:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.