LayoutTests/fast/block/lineboxcontain/glyphs.html - Issue 1328673003: Remove -webkit-line-box-contain implementation.

Side by Side Diff

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Keyboard Shortcuts

	File
u :	up to issue
j / k :	jump to file after / before current file
J / K :	jump to next file with a comment after / before current file
	Side-by-side diff
i :	toggle intra-line diffs
e :	expand all comments
c :	collapse all comments
s :	toggle showing all comments
n / p :	next / previous diff chunk or comment
N / P :	next / previous comment
<Up> / <Down> :	next / previous line

	Issue
u :	up to list of issues
j / k :	jump to patch after / before current patch
o / <Enter> :	open current patch in side-by-side view
i :	open current patch in unified diff view

	Issue List
j / k :	jump to issue after / before current issue
o / <Enter> :	open current issue

Side by Side Diff: LayoutTests/fast/block/lineboxcontain/glyphs.html

Issue 1328673003: Remove -webkit-line-box-contain implementation. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Fix up a few more tests. Created 5 years, 3 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

OLD	NEW
	(Empty)
1 <!doctype html>

2 <head>

3 <title>line-box-contain: glyphs</title>

4 <style>

5 .test { -webkit-line-box-contain: glyphs; line-box-contain: glyphs; font: 64px/1 em Ahem; background-color:red; width:6em; overflow:hidden }

6 .goodline { color: green; line-height:12; border-top: 1px solid green; }

7 .contains-drop-cap::first-letter { font-size:36px; float:left; margin-right:2px; -webkit-line-box-contain:glyphs; line-box-contain:glyphs }

8 </style>

9 </head>

10 <body>

11 You should see a green rectangle below. If you see any red, the test has failed .

12

13 <!--

14 Ahem has 0.2em descent and 0.8em ascent, so 64px Ahem has 12.8px descent and 51.2px ascent.

15 Since we expand to enclosing integer points, the integer glyph bounds will b e 65px tall.

16 As a result, we need 64px of text + 1px of extra border to fill the line box .

17 This is not an elegant hack; sorry.

18

19 Warning: this is very sensitive to changes in font code and may need adjustm ent later.

20 -->

21 <div class="test">

22 <span class="goodline">xxxxx</span><span style="background-color:green; font-siz e:128px; padding-left:0.5em;"></span><br>

23 <div style="display:inline-block; width:1em;height:2em;vertical-align:bottom;bac kground-color:green"></div><span class="goodline">xxxxx</span>

24 </div>

25

26 <p style="-webkit-line-box-contain:glyphs;line-box-contain: glyphs; border:1px s olid black">this block should hug the lowercase glyphs.</p>

27

28 <p class="contains-drop-cap">The first letter here should look nicer because it uses glyph bounds<br>This should make the top of the T

29 line up with the line and not look shifted down.<br> Maybe we should do this by default for all first letters like Firefox does.

30

OLD	NEW