Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="author" title="Sammy Gill" href="mailto:sammy.gill@apple.com">
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#algo-find-fr-size">
<meta name="assert" content="A grid whose first column is a flexible (fr) track can be sized under a max-content constraint when a grid item's max-content contribution is smaller than the flexible track's base size, without crashing.">
<style>
#grid {
display: grid;
grid-template-columns: 1fr;
width: fit-content;
}
#grid > div {
height: 50px;
background: green;
}
#grid > div > div {
height: 50px;
}
.wide { width: 100px; }
.narrow { width: 40px; }
</style>
<p>Test passes if there is a filled green square.</p>
<div id="grid">
<div><div class="wide"></div></div>
<div><div class="narrow"></div></div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="author" title="Sammy Gill" href="mailto:sammy.gill@apple.com">
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#algo-flex-tracks">
<meta name="assert" content="When a grid with multiple flexible (fr) columns is sized under a definite length, the leading track (column index 0) can be treated as inflexible while a later track stays flexible, without crashing.">
<style>
#grid {
display: grid;
grid-template-columns: 1fr 1fr;
width: 100px;
}
#grid > div {
height: 50px;
background: green;
}
#grid > div > div {
height: 50px;
}
.wide { width: 80px; }
.narrow { width: 10px; }
</style>
<p>Test passes if there is a filled green square.</p>
<div id="grid">
<div><div class="wide"></div></div>
<div><div class="narrow"></div></div>
<div></div>
<div></div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="author" title="Sammy Gill" href="mailto:sammy.gill@apple.com">
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#algo-find-fr-size">
<meta name="assert" content="A grid whose first column is a flexible (fr) track can be sized under a max-content constraint when a grid item's max-content contribution is smaller than the flexible track's base size, without crashing.">
<style>
#grid {
display: grid;
grid-template-columns: 1fr;
width: fit-content;
justify-items: stretch;
}
#grid > div {
height: 50px;
background: green;
}
#grid > div > div {
height: 50px;
}
.wide { width: 100px; }
.narrow { width: 40px; }
</style>
<p>Test passes if there is a filled green square.</p>
<div id="grid">
<div><div class="wide"></div></div>
<div><div class="narrow"></div></div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="author" title="Sammy Gill" href="mailto:sammy.gill@apple.com">
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#algo-flex-tracks">
<meta name="assert" content="When a grid with multiple flexible (fr) columns is sized under a definite length, the leading track (column index 0) can be treated as inflexible while a later track stays flexible, without crashing.">
<style>
#grid {
display: grid;
grid-template-columns: 1fr 1fr;
width: 100px;
justify-items: stretch;
}
#grid > div {
height: 50px;
background: green;
}
#grid > div > div {
height: 50px;
}
.wide { width: 80px; }
.narrow { width: 10px; }
</style>
<p>Test passes if there is a filled green square.</p>
<div id="grid">
<div><div class="wide"></div></div>
<div><div class="narrow"></div></div>
<div></div>
<div></div>
</div>
Loading