In my environment, the problem was in the Markdown Editor plugin. Once editing or adding an answer with <pre> block, the edit area and the preview area didn't wrap lines and kept the screen very wide (even on desktop displays):

P.S.: This behavior was detected only by Google mobile usability test (that "clicks" on the "Answer" button). It was not detected when testing the page by common tools like Lighthouse.
I fixed it with (quite dirty) modifying of CSS file
qa-pluginmarkdown-editorpagedownsample.css:
.wmd-preview pre,
.qa-a-item-content pre {
width: 100%; /* ADDED */
max-height: 400px;
max-width: 685px;
overflow: auto;
}
@media (max-width: 768px) {
.wmd-preview pre,
.qa-a-item-content pre {
max-width: 550px;
}
}
@media (max-width: 370px) {
.wmd-preview pre,
.qa-a-item-content pre {
max-width: 250px;
}
|