50 lines
1.5 KiB
HTML
50 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<link href="resources/grid.css" rel="stylesheet">
|
|
<style type="text/css">
|
|
#grid-1 {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
#grid-2 {
|
|
grid-template-columns: auto;
|
|
}
|
|
</style>
|
|
<script>
|
|
window.onload = function () {
|
|
if (window.testRunner) {
|
|
testRunner.waitUntilDone();
|
|
}
|
|
|
|
// Prevent WebKit1 hangs by ensuring layout is up-to-date before resize.
|
|
setTimeout(function() { window.resizeTo(600, 600); }, 0);
|
|
}
|
|
|
|
window.onresize = function () {
|
|
if (window.testRunner) {
|
|
testRunner.notifyDone();
|
|
}
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<h1>Description</h1>
|
|
<p>Grid flex and content sized columns width should be updated properly when you resize the window (you should not see the grid background in grey color).</p>
|
|
<h1>Grid 2 flex columns</h1>
|
|
<div id="grid-1" class="grid">
|
|
<div class="firstRowFirstColumn">first column</div>
|
|
<div class="firstRowSecondColumn">second column</div>
|
|
</div>
|
|
<h1>Grid 1 auto column</h1>
|
|
<div id="grid-2" class="grid">
|
|
<div class="firstRowFirstColumn">
|
|
one column one column one column one column one column one column one column one column
|
|
one column one column one column one column one column one column one column one column
|
|
one column one column one column one column one column one column one column one column
|
|
one column one column one column one column one column one column one column one column
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|