AlexsanderDamaceno
cceb4a7a69
Automatic update from web-platform-tests WebKit export of https://bugs.webkit.org/show_bug.cgi?id=285849 -- change table-cell-width-0.html -- Change table-cell-width-0.html -- wpt-commits: ade4b37314c57180ae929ccf062cd03658f8108a, 381432218127d2113881e00b767baf6532650d4b, d2237ca5b890c6c2d5ca2f16a2686f6f7d282855 wpt-pr: 59292
108 lines
1.7 KiB
HTML
108 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Reference for table cell with `width:0` case testing different table widths</title>
|
|
<style>
|
|
.row {
|
|
display: flex;
|
|
border: 2px solid black;
|
|
border-spacing: 2px;
|
|
text-indent: initial;
|
|
box-sizing: border-box;
|
|
width: fit-content;
|
|
}
|
|
|
|
.row.percent {
|
|
width: 100%;
|
|
}
|
|
|
|
.row.fixed {
|
|
width: 100px;
|
|
}
|
|
|
|
.cell {
|
|
padding: 1px;
|
|
line-height: normal;
|
|
font: initial;
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
.zero {
|
|
width: fit-content;
|
|
background:lightblue;
|
|
}
|
|
|
|
.positive-width {
|
|
width: auto;
|
|
background:lightblue;
|
|
}
|
|
|
|
.big-positive-width {
|
|
width: 20px;
|
|
background:lightblue;
|
|
}
|
|
|
|
.normal {
|
|
background:lightgreen;
|
|
flex: 1;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- auto width -->
|
|
<div class="row">
|
|
<div class="cell zero">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
<br>
|
|
|
|
<div class="row">
|
|
<div class="cell positive-width">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
<br>
|
|
|
|
<div class="row">
|
|
<div class="cell big-positive-width">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
<br>
|
|
|
|
<!-- width:100% -->
|
|
<div class="row percent">
|
|
<div class="cell zero">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
|
|
<div class="row percent">
|
|
<div class="cell positive-width">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
|
|
<div class="row percent">
|
|
<div class="cell big-positive-width">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
<br>
|
|
|
|
<!-- width:100px -->
|
|
<div class="row fixed">
|
|
<div class="cell zero">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
|
|
<div class="row fixed">
|
|
<div class="cell positive-width">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
|
|
<div class="row fixed">
|
|
<div class="cell big-positive-width">1</div>
|
|
<div class="cell normal">2</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|