wuggy/Dactyloidae
wuggy/Dactyloidae
1
0
Fork 0
mirror of https://repo.dactyloidae.xyz/Dactyloidae/UXP.git synced 2026-09-26 10:27:32 +09:00
Code Issues Projects Releases Packages Wiki Activity

import FIREFOX_52_6_0esr_RELEASE from mozilla-esr52 hg repo

Browse source
This commit is contained in:
Roy Tam 2018-01-19 03:59:58 +08:00
commit dcd9973243
150858 changed files with 23884658 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

147
layout/reftests/css-grid/grid-auto-min-sizing-percent-001-ref.html Normal file
View file

@ -0,0 +1,147 @@
<!DOCTYPE HTML>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<html><head>
<meta charset="utf-8">
<title>Reference: Testing 'auto' min-sizing with percentage sizes</title>
<link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1176775">
<style type="text/css">
body,html { color:black; background:white; font-size:10px; padding:0; margin:0; }
.wrap {
float: left;
}
.grid {
display: grid;
float: left;
grid-template-columns: minmax(0,0) 1fr;
grid-auto-rows: 10px;
border: 1px solid;
}
.item {
grid-row: 1 / 2;
grid-column: 1 / 2;
background:lime;
min-height:10px;
}
.item2 {
grid-row: 2 / 3;
grid-column: 1 / 2;
min-width:0;
min-height:10px;
justify-self:stretch;
background:grey;
}
br { clear:both; }
#px-border .item { border-left:20px solid blue; }
#percent-border .item { padding-left:10%; }
#px-border .grid { grid-template-columns: minmax(20px,0) 1fr; }
.c100 { grid-template-columns: minmax(100px,0) 1fr; }
.c100100 { grid-template-columns: minmax(100px,0) 100px; }
.c200 { grid-template-columns: 200px; }
#px-border .c100 { grid-template-columns: minmax(120px,0) 1fr; }
#px-border .c100calc100 { grid-template-columns: minmax(120px,0) 1fr; }
#px-border .c100100 { grid-template-columns: minmax(120px,0) 120px; }
#px-border .c200 { grid-template-columns: 240px; }
.c10 { grid-template-columns: minmax(10px,0) 1fr; }
#px-border .c10 { grid-template-columns: minmax(30px,0) 1fr; }
#percent-border .c100 { grid-template-columns: 111px 0; }
#percent-border .c100calc100 { grid-template-columns: 100px 11px; }
#percent-border .c10 { grid-template-columns: minmax(11px,0) 0; }
#percent-border .c100100 { grid-template-columns: minmax(100px,0) 150px; }
#percent-border .c200 { grid-template-columns: 250px; }
</style>
</head>
<body>
<table border="1">
<tr><th>no border/padding/margin</th><th>'border-left:20px'</th><th>'padding-left:10%'</th>
<tr><td id="no-border"></td><td id="px-border"></td><td id="percent-border"></td>
</tr></table>
<script>
var styles = [
"width:50%",
"width:50%; max-width:1px",
"width:50%; min-width:100px",
"width:calc(100px)",
"width:calc(100px + 50%)",
"width:100px; padding-right:50%",
"width:calc(100px + 50%); min-width:10px",
"width:calc(10px + 50%); min-width:100px",
"width:calc(75px + 50%); min-width:100px",
"width:calc(100px + 50%); max-width:1px",
"width:calc(100px + 50%); max-width:150px",
"min-width:50%",
"min-width:50%; max-width:1px",
"min-width:50%; width:100px",
"min-width:calc(100px)",
"min-width:calc(100px + 50%)",
"min-width:100px; padding-right:50%",
"min-width:calc(100px + 50%); width:10px",
"min-width:calc(10px + 50%); width:100px",
"min-width:calc(75px + 50%); width:100px",
"min-width:calc(100px + 50%); max-width:1px",
"min-width:calc(100px + 50%); max-width:150px",
];
var grids = [
"grid",
"grid",
"grid c100",
"grid c100",
"grid",
"grid c200",
"grid c10",
"grid c100",
"grid c100",
"grid",
"grid",
"grid",
"grid",
"grid c100",
"grid c100",
"grid",
"grid c200",
"grid c10",
"grid c100",
"grid c100",
"grid",
"grid",
];
var containers = [ "no-border", "px-border", "percent-border" ];
for (var i = 0; i < containers.length; ++i) {
var c = document.querySelector("#"+containers[i]);
for (var j = 0; j < styles.length; ++j) {
c.appendChild(document.createElement('br'));
c.appendChild(document.createTextNode(styles[j]));
c.appendChild(document.createElement('br'));
var item = document.createElement('div');
item.setAttribute("class","item");
item.setAttribute("style", styles[j]);
var item2 = document.createElement('div');
item2.setAttribute("class","item2");
var grid = document.createElement('div');
grid.setAttribute("class",grids[j]);
grid.appendChild(item);
grid.appendChild(item2);
var wrap = document.createElement('div');
wrap.setAttribute("class","wrap");
wrap.appendChild(grid);
c.appendChild(wrap);
}
}
</script>
</body>
</html>