New issue
Advanced search Search tips

Issue 863276 link

Starred by 1 user
Status: WontFix
Owner: ----
Closed: Jul 23
Cc:
jbanavatu@chromium.org
Components:
EstimatedDays: ----
NextAction: ----
OS: Android
Pri: 2
Type: Bug



Sign in to add a comment

Web page doesn't layout correctly due to text font autosizing

Reported by zuojingl...@xiaomi.com, Jul 13 
Example URL:
http://www.12306.cn/mormhweb/zxdt/index_zxdt.html

Steps to reproduce the problem:
1. Open url:http://www.12306.cn/mormhweb/zxdt/index_zxdt.html

What is the expected behavior?

What went wrong?
Text overlap.

Does it occur on multiple sites: N/A

Is it a problem with a plugin? No 

Did this work before? N/A 

Does this work in other browsers? N/A

Chrome version: trunk  Channel: beta
OS Version: 8.0
Flash Version:
layout.png
744 KB View Download

Comment 1 by jbanavatu@chromium.org, Jul 16

Cc: jbanavatu@chromium.org
Components: UI>Input>Text
Labels: -Type-Compat M-69 FoundIn-67 Needs-triage-Mobile Triaged-Mobile Target-69 FoundIn-68 FoundIn-69 Type-Bug
Status: Untriaged (was: Unconfirmed)
Tested the issue on Android and observed text overlap.

Steps followed:
1. Launch chrome >> Go to http://www.12306.cn/mormhweb/zxdt/index_zxdt.html
2. Observed text overlap

Chrome versions tested:
60.0.3072.0, 67.0.3396.87(Stable), 69.0.3479(Canary)

OS:
Android 8.1.0

Android Devices:
Pixel 2 

This seems to be a Non-Regression issue as same behavior is seen since M-60. Leaving the issue as Untriaged for further input's on this issue.

Please navigate to below link for log's --
go/chrome-androidlogs/863276
 
Thanks!

Comment 2 by jbanavatu@chromium.org, Jul 16

Components: -UI>Input>Text Blink>TextAutosize

Comment 3 by e...@chromium.org, Jul 23

Status: WontFix (was: Untriaged)
Yeah this is a known problem with text autosize where it intentionally breaks layout to increase legibility.
One can add a viewport tag to opt out of the behavior but short of that this is to be expected.

Comment 4 by pdr@chromium.org, Jul 23 

@zuojinglong, can you try adding one of the following to your page?

1) Use a meta viewport at the top of your page to declare your page "mobile designed":
<meta name="viewport" content="width=device-width, initial-scale=1">

2) Use the CSS style "text-size-adjust: none;" to disable adjustment (e.g., on <body> or <html>).

Comment 5 by zuojingl...@xiaomi.com, Jul 24 

@pdr, after adding the above code to the page, the layout breaking disappears.

The following will be better?

If before text layout, after getting multiplier form Block, then computing the real height of the block which contains text cluster, if [the cluster text's height] > [the containging block's specific height], then will reset the multiplier to 1.0.

height of the cluster text = ceil( text_length / containg_block_width) * line_height * multiplier.

Comment 6 by pdr@chromium.org, Jul 24 

@zuojinglong, I pretty much agree. We should be doing something like that already (if a height is specified, BlockSuppressesAutosizing should return true). For some reason it is not triggering on your page.

The text autosizer is primarily for legacy desktop pages, as it helped a lot when mobile phones first came out and there were only desktop pages. My hope is that we can turn the feature off in the future.
►

Sign in to add a comment