mirror of
https://repo.dactyloidae.xyz/Dactyloidae/UXP.git
synced 2026-09-24 01:17:34 +09:00
import FIREFOX_52_6_0esr_RELEASE from mozilla-esr52 hg repo
This commit is contained in:
commit
dcd9973243
150858 changed files with 23884658 additions and 0 deletions
|
|
@ -0,0 +1,175 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: table-layout fixed - columns with percentage height and absolute height</title>
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
|
||||
<link rel="author" title="Adapted for vertical layout by Simon Montagu" href="http:/mozilla.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#fixed-table-layout" title="17.5.2.1 Fixed table layout">
|
||||
<link rel="match" href="fixed-table-layout-023-ref.htm">
|
||||
<meta content="" name="flags">
|
||||
<meta content="A column with a percentage height in a 'table-layout: fixed' table can be calculated, predicted, rendered." name="assert">
|
||||
<style type="text/css">
|
||||
div.test { writing-mode: vertical-rl; }
|
||||
body
|
||||
{
|
||||
margin: 8px;
|
||||
height: 640px;
|
||||
}
|
||||
table
|
||||
{
|
||||
border: white solid;
|
||||
border-width: 11px 0px; /* vertical table border height is 22px total */
|
||||
border-collapse: separate;
|
||||
border-spacing: 18px 4px; /* vertical border-spacing height is 90px total */
|
||||
table-layout: fixed;
|
||||
height: 80%; /* 640px mult by 80% == 512px */
|
||||
/*
|
||||
"With this (fast) algorithm, the vertical layout of
|
||||
the table does not depend on the contents of the cells;
|
||||
it only depends on the table's height, the height of
|
||||
the columns, and [table] borders or cell spacing."
|
||||
So,
|
||||
512px : total table height
|
||||
-
|
||||
90px : total vertical border-spacing height
|
||||
-
|
||||
22px : total vertical border-spacing height
|
||||
========
|
||||
400px : total to split among the 4 columns
|
||||
*/
|
||||
}
|
||||
col#first
|
||||
{
|
||||
background-color: fuchsia;
|
||||
height: 13%;
|
||||
/* 400px multiplied by 13% = 52px */
|
||||
}
|
||||
col#second
|
||||
{
|
||||
background-color: olive;
|
||||
height: 100px;
|
||||
}
|
||||
col#third
|
||||
{
|
||||
background-color: orange;
|
||||
height: 31%;
|
||||
/* 400px multiplied by 31% = 124px */
|
||||
/*
|
||||
400px - (52px + 100px + 124px) = 124px for last column
|
||||
*/
|
||||
}
|
||||
col#fourth {background-color: lime;}
|
||||
td {padding: 10px 0px; width: 24px; }
|
||||
td#first-cell {color: fuchsia;}
|
||||
td#second-cell {color: olive;}
|
||||
td#third-cell {color: orange;}
|
||||
td#fourth-cell {color: lime;}
|
||||
div {padding: 0px;}
|
||||
div#reference1st
|
||||
{
|
||||
background-color: fuchsia;
|
||||
color: fuchsia;
|
||||
top: 29px; /* 11px border-top of table + 18px border-spacing == 29px */
|
||||
right: 72px;
|
||||
position: relative;
|
||||
height: 52px;
|
||||
width: 24px;
|
||||
}
|
||||
div#reference2nd
|
||||
{
|
||||
background-color: olive;
|
||||
right: 48px;
|
||||
color: olive;
|
||||
top: 99px;
|
||||
/*
|
||||
11px : border-top of table
|
||||
+
|
||||
18px : 1st border-spacing
|
||||
+
|
||||
52px : height of first column
|
||||
+
|
||||
18px : 2nd border-spacing
|
||||
=======
|
||||
99px
|
||||
*/
|
||||
position: relative;
|
||||
height: 100px;
|
||||
width: 24px;
|
||||
}
|
||||
div#reference3rd
|
||||
{
|
||||
background-color: orange;
|
||||
right: 24px;
|
||||
color: orange;
|
||||
top: 217px;
|
||||
/*
|
||||
11px : border-top of table
|
||||
+
|
||||
18px : 1st border-spacing
|
||||
+
|
||||
52px : height of first column
|
||||
+
|
||||
18px : 2nd border-spacing
|
||||
+
|
||||
100px : height of second column
|
||||
+
|
||||
18px : 3rd border-spacing
|
||||
=======
|
||||
217px
|
||||
*/
|
||||
position: relative;
|
||||
height: 124px;
|
||||
width: 24px;
|
||||
}
|
||||
div#reference4th
|
||||
{
|
||||
background-color: lime;
|
||||
color: lime;
|
||||
top: 359px;
|
||||
/*
|
||||
11px : border-top of table
|
||||
+
|
||||
18px : 1st border-spacing
|
||||
+
|
||||
52px : height of first column
|
||||
+
|
||||
18px : 2nd border-spacing
|
||||
+
|
||||
100px : height of second column
|
||||
+
|
||||
18px : 3rd border-spacing
|
||||
+
|
||||
124px : height of third column
|
||||
+
|
||||
18px : 4th border-spacing
|
||||
=======
|
||||
359px
|
||||
*/
|
||||
position: relative;
|
||||
height: 124px;
|
||||
width: 24px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>Test passes if the colored (fuchsia, olive, orange and lime) stripes have respectively the same heights and the same vertical positions.</p>
|
||||
<div class="test">
|
||||
<div id="reference1st">ref</div>
|
||||
<div id="reference2nd">ref</div>
|
||||
<div id="reference3rd">ref</div>
|
||||
<div id="reference4th">ref</div>
|
||||
<table>
|
||||
<col id="first">
|
||||
<col id="second">
|
||||
<col id="third">
|
||||
<col id="fourth">
|
||||
<tr>
|
||||
<td id="first-cell">1st</td>
|
||||
<td id="second-cell">2nd</td>
|
||||
<td id="third-cell">3rd</td>
|
||||
<td id="fourth-cell">4th</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue