mirror of
https://github.com/servo/servo.git
synced 2025-06-23 16:44:33 +01:00
296fa2512b
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180. - Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
58 lines
No EOL
2.1 KiB
HTML
58 lines
No EOL
2.1 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
|
|
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
|
|
<title>CSS Writing Modes Test: line box height and border on non-replaced inline box (sideways)</title>
|
|
|
|
<!--
|
|
Test inspired by
|
|
https://dxr.mozilla.org/mozilla-central/source/layout/reftests/writing-mode/1130907-intrinsic-sizing-2.html
|
|
-->
|
|
|
|
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
|
|
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
|
|
<link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" title="10.8.1 Leading and half-leading" />
|
|
<link rel="match" href="reference/line-box-height-vrl-006-ref.xht" />
|
|
|
|
<meta content="" name="flags" />
|
|
<meta content="This test checks that a line box height does not increase because an inline non-replaced box has a border. In this test, the '34' inline box and the '56' inline box should be lined up with its inline '12' sibling. The line box height, enclosed by the blue border should not grow to accomodate transparent 'border-left' of inline box and transparent 'border-right' of inline box." name="assert" />
|
|
|
|
<style type="text/css"><![CDATA[
|
|
body
|
|
{
|
|
margin-left: 32px;
|
|
}
|
|
|
|
div
|
|
{
|
|
border: blue solid 2px;
|
|
font-size: 32px;
|
|
margin: 1em;
|
|
writing-mode: vertical-rl;
|
|
text-orientation: sideways;
|
|
}
|
|
|
|
span#border-left
|
|
{
|
|
border-left: 1.5em solid transparent;
|
|
}
|
|
|
|
span#border-right
|
|
{
|
|
border-right: 1.5em solid transparent;
|
|
}
|
|
]]></style>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<p>Test passes if there are 2 identical blue rectangles with "123456" rotated 90 degrees clockwise. The size of each blue rectangles must be identical and the two "123456" numbers must be enclosed by the two blue borders.</p>
|
|
|
|
<div id="test">12<span id="border-left">34</span><span id="border-right">56</span></div>
|
|
|
|
<div id="reference">123456</div>
|
|
|
|
</body>
|
|
</html> |