mirror of
https://github.com/servo/servo
synced 2026-04-28 18:37:39 +02:00
63 lines
2.4 KiB
HTML
63 lines
2.4 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 Test: Line-height using points with a minimum minus one value, -1pt</title>
|
|
<style type="text/css">
|
|
@page { font: italic 8pt sans-serif; color: gray;
|
|
margin: 7%;
|
|
counter-increment: page;
|
|
@top-left { content: "CSS 2.1 Conformance Test Suite"; }
|
|
@top-right { content: "Test line-height-012"; }
|
|
@bottom-right { content: counter(page); }
|
|
}
|
|
</style>
|
|
<link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
|
|
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-04-04 -->
|
|
<link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#propdef-line-height" />
|
|
<link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#leading" />
|
|
<meta name="flags" content="ahem invalid should" />
|
|
<meta name="assert" content="The 'line-height' property sets a minimum minus one length value in points." />
|
|
<style type="text/css">
|
|
div
|
|
{
|
|
font: 1in Ahem;
|
|
position: relative;
|
|
width: 1em;
|
|
}
|
|
#div2, #div3, #div4
|
|
{
|
|
position: absolute;
|
|
top: 0;
|
|
}
|
|
#div2, #div4
|
|
{
|
|
background: black;
|
|
}
|
|
#div2
|
|
{
|
|
height: 1.2em;
|
|
left: 0;
|
|
}
|
|
#div3
|
|
{
|
|
background: blue;
|
|
color: blue;
|
|
left: 1em;
|
|
line-height: -1pt;
|
|
}
|
|
#div4
|
|
{
|
|
height: 1em;
|
|
left: 2em;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p>Test passes if the height of the blue box is similar to the height of the black boxes. It is acceptable to have the blue box height be shorter or taller than the height of either of the black boxes. The black boxes represent the recommended settings for 'line-height'.</p>
|
|
<div id="div1">
|
|
<div id="div2"></div>
|
|
<div id="div3">X</div>
|
|
<div id="div4"></div>
|
|
</div>
|
|
</body>
|
|
</html> |