1179952 - Baseline alignment of inline-block and inline-table when dominant baseline is central

Status: RESOLVED DUPLICATE of bug 1812679

(Core :: Layout: Block and Inline, defect)

Description

[Gérard Talbot]

Interactive (vendor-prefixed) tests
-----------------------------------

http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/vert-align-latin-baseline-inline-block-dhtml.html

http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/vert-align-latin-baseline-inline-block-dhtml-2.html

http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/vert-align-latin-baseline-inline-table-dhtml.html



Steps to reproduce
------------------

A)
1- Load

http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/vert-align-latin-baseline-inline-block-dhtml.html

2- Make sure that 'mixed' and 'baseline' radio buttons are checked

B) 
1- Load

http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/vert-align-latin-baseline-inline-table-dhtml.html

2- Make sure that 'mixed' and 'baseline' radio buttons are checked



Expected results
----------------

A)
the inline-block is baseline-aligned within the line box in accordance with the baseline of its own last line box

B) 
the inline-table is baseline-aligned within the line box in accordance with the baseline of its first row box



More info
---------

CSS2.1, section 10.8.1 states:

"
The baseline of an 'inline-table' is the baseline of the first row of the table.

The baseline of an 'inline-block' is the baseline of its last line box in the normal flow, unless it has either no in-flow line boxes or if its 'overflow' property has a computed value other than 'visible', in which case the baseline is the bottom margin edge.
"
http://www.w3.org/TR/CSS21/visudet.html#leading


http://lists.w3.org/Archives/Public/www-style/2015Jun/0116.html

http://lists.w3.org/Archives/Public/www-style/2015Jun/0324.html

http://lists.w3.org/Archives/Public/www-style/2015Jun/0325.html

http://lists.w3.org/Archives/Public/www-style/2015Jun/0326.html

http://lists.w3.org/Archives/Public/www-style/2015Jul/0007.html

http://lists.w3.org/Archives/Public/www-style/2015Jul/0008.html

- I am using Firefox 42.0a1 buildID=20150701030207
- I use Linux 3.13.0-55-generic x86_64, Qt: 4.8.6, KDE 4.13.3; Kubuntu (utopic) 14.04.2 LTS
- I've searched for duplicates and did not find any

Comment 1

[Jonathan Kew [:jfkthame]]

Thanks for the testcases -- we'll look into them.

> B) 
> 1- Load
> 
> http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/vert-align-latin-
> baseline-inline-table-dhtml.html
> 
> 2- Make sure that 'mixed' and 'baseline' radio buttons are checked
> 

There's a minor error in test B, such that the radio buttons for alignment options don't work -- the JS refers to the id "inline-block", where it should be "inline-table".

Comment 2

[Gérard Talbot]

Thank you, Jonathan.

Fixed and uploaded now.

Gérard

Comment 3

[Gérard Talbot]

Additional (unprefixed) tests
-----------------------------

inline-block with 'writing-mode: vertical-rl' and 'text-orientation: mixed'
http://test.csswg.org/source/css-writing-modes-3/inline-block-alignment-002.xht

inline-block with 'writing-mode: vertical-lr' and 'text-orientation: mixed'
http://test.csswg.org/source/css-writing-modes-3/inline-block-alignment-003.xht

inline-block with 'writing-mode: vertical-rl' and 'text-orientation: upright'
http://test.csswg.org/source/css-writing-modes-3/inline-block-alignment-004.xht

inline-block with 'writing-mode: vertical-lr' and 'text-orientation: upright'
http://test.csswg.org/source/css-writing-modes-3/inline-block-alignment-005.xht



Expected results for inline-block-alignment-002 and inline-block-alignment-004:
http://test.csswg.org/source/css-writing-modes-3/inline-block-alignment-002-ref.xht

Expected results for inline-block-alignment-003 and inline-block-alignment-005:
http://test.csswg.org/source/css-writing-modes-3/inline-block-alignment-003-ref.xht

Comment 4

[Gérard Talbot]

Unprefixed inline-table baseline-alignment tests
------------------------------------------------

http://test.csswg.org/suites/css-writing-modes-3_dev/nightly-unstable/html/inline-table-alignment-002.htm

http://test.csswg.org/suites/css-writing-modes-3_dev/nightly-unstable/html/inline-table-alignment-003.htm

http://test.csswg.org/suites/css-writing-modes-3_dev/nightly-unstable/html/inline-table-alignment-004.htm

http://test.csswg.org/suites/css-writing-modes-3_dev/nightly-unstable/html/inline-table-alignment-005.htm



Expected results for inline-table-alignment-002 and inline-table-alignment-004:
http://test.csswg.org/suites/css-writing-modes-3_dev/nightly-unstable/html/reference/inline-table-alignment-002-ref.htm

Expected results for inline-table-alignment-003 and inline-table-alignment-005:
http://test.csswg.org/suites/css-writing-modes-3_dev/nightly-unstable/html/reference/inline-table-alignment-003-ref.htm

Firefox 43.0a1 buildID=20150814091803 fails all 4 tests.

Chrome 46.0.2478.0 passes only the 002 and 004 tests.

Comment 5

[Gérard Talbot]

Baselines of inline-block and inline-table do not respect the last line box or the first row if 'writing-mode' is 'vertical-lr'
https://bugs.chromium.org/p/chromium/issues/detail?id=664386

Comment 6

[Gérard Talbot]

Baselines of inline-block and inline-table do not respect the last line box or the first row if 'writing-mode' is 'vertical-lr'
https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/9761275/