Bug 117229

Summary:

Fix issues with text inputs in vertical writing mode

Product:

WebKit

Reporter:

SiqinBilige <siqinbilige>

Component:

Forms

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED MOVED

Severity:

Normal

CC:

browserbugs2, ntim, webkit-bug-importer

Priority:

Keywords:

InRadar

Version:

528+ (Nightly build)

Hardware:

All

OS:

All

URL:

http://www.mongolfont.com/test/mongolian_text.html

Bug Depends on:

Bug Blocks:

245355

Attachments:

Description	Flags
actual	none
expected	none
Form controls don't go vertical	none

SiqinBilige

Reported 2013-06-05 00:10:34 PDT

-webkit-writing-mode: vertical-lr; does not work on input text element. but can work on contenteditable div. 1. http://dev.w3.org/csswg/css-writing-modes/#text-flow 2. http://fantasai.inkedblade.net/style/discuss/vertical-text/#logical-orientation 3. http://fantasai.inkedblade.net/style/discuss/vertical-text/diagrams/mongolian-vectors.jpg

Attachments
actual (1.58 KB, image/png) 2013-06-05 00:11 PDT, SiqinBilige	no flags	Details
expected (2.23 KB, image/png) 2013-06-05 00:11 PDT, SiqinBilige	no flags	Details
Form controls don't go vertical (8.31 KB, image/png) 2017-07-19 18:53 PDT, SiqinBilige	no flags	Details
View All Add attachment proposed patch, testcase, etc.

SiqinBilige

Comment 1 2013-06-05 00:11:11 PDT

Created attachment 203756 [details] actual

SiqinBilige

Comment 2 2013-06-05 00:11:34 PDT

Created attachment 203757 [details] expected

Gérard Talbot (no longer involved)

Comment 3 2017-07-19 11:55:47 PDT

Submitted test on various input and button elements and vertical-lr writing mode: http://test.csswg.org/suites/css-writing-modes-3_dev/nightly-unstable/html/form-controls-vlr-005.htm Note that a) the test uses a "SHOULD": so passing that test is recommended but not required to be able to claim conformance with the spec. b) the tests in all CSS test suites never use vendor prefixes

SiqinBilige

Comment 4 2017-07-19 18:53:02 PDT

This issue have a relation to https://bugs.webkit.org/show_bug.cgi?id=70211 https://bugs.webkit.org/attachment.cgi?id=192264&action=diff

SiqinBilige

Comment 5 2017-07-19 18:53:52 PDT

Created attachment 315962 [details] Form controls don't go vertical

Gérard Talbot (no longer involved)

Comment 6 2017-08-05 14:01:41 PDT

SiqinBilige, Your attachment 203757 [details] (mongolian_text_expected.PNG expected result) most likely originate from Firefox rendering... but I want to point out that the used content height of text input should not be too tall (approx. 500px in your attachment 203757 [details] screen shot, which is too much), especially since you did not specify the size attribute for that text input in your test/mongolian_text.html test. The default size in HTML5 for text input is 20 characters. More info: https://bugzilla.mozilla.org/show_bug.cgi?id=1387690

Tim Nguyen (:ntim)

Comment 7 2022-11-22 18:28:30 PST Comment hidden (obsolete)

The only thing that's broken with the preference on is the painting of the native borders. Needs to be rotated.

Radar WebKit Bug Importer

Comment 8 2022-11-23 14:23:52 PST

<rdar://problem/102633864>

Tim Nguyen (:ntim)

Comment 9 2023-09-24 18:40:37 PDT

Morphing this issue once again, since the border actually should not get rotated here

Note You need to log in before you can comment on or make changes to this bug.