271167 - wyomingtourism.org - overlapping text on zoom

Status: RESOLVED INVALID

(Web Compatibility :: Site Reports, defect)

Description

[Felix Miata]

body {font-size:10px;} makes page unreadable, but when you zoom as little as 20%
trying to make it readable, text overlaps, and gets worse as zoom is increased.

No doctype. No charset. Does not validate on the fallback.
http://www.wyomingtourism.org/styles/default.css

Comment 1

[sjw]

Seems fixed / redesigned.
[closeme]

Comment 2

[Felix Miata]

IIRC, when this was filed almost a decade ago, there was no such thing as page zoom. Selecting text-only zoom, pages on the site with more than nominal text still produce overlapping in various places.

Comment 3

[Felix Miata]

Attachment: screenshot of overlapping text

It may or may not be better than it was, but it's certainly not entirely fixed. Its 100k+ stylesheet http://www.wyomingtourism.org/CSS/styles.css?r=20130628.1 contains 75 lines containing the string line-height. All that I examined were either px or em, both of which are known to be prone to causing overlap when minimum font size or text-only zoom is applied.

As shown in the screenshot, .section-nav li a is constrained to a height of 30px, into which the two lines of 18.6px text in the image cannot fit without overlapping. Its ancestor .section-nav li has a font-size of 26.6px with a line-height of only 24.1px. So, the problem here, as is often the case, is inept styling that causes text obviously intended to fit on one line to require two lines. The root cause, as too often happens, is use of px to size containers into which text sized in px is supposed to fit.

Comment 4

[Karl Dubost💡 :karlcow]

Felix,

It's partly because of these issues on most Web sites of size set in pixels that "page zoom" (as opposed to "text-only zoom") was created. We could embark on a journey to try to get all these fixed. :) It would create a lot of work for a few hundred of thousands of people. ;) You are welcome to try to contact the site if you think it's worth your time. 

I checked the Web site across a couple of browsers, and we get the same behavior, so I'm not sure we should spend more time. I encourage we close the bug as WONTFIX.

Comment 5

[Hallvord R. M. Steen [:hallvors]]

I agree with Karl. We've made technical changes in core and rendering to work around this issue - so at this point it's not really much of an issue anymore. We shouldn't fight yesterday's battles when there's so much more to do.