134 lines
3.2 KiB
HTML
134 lines
3.2 KiB
HTML
<!DOCTYPE html>
|
|
<style>
|
|
table {
|
|
border: 5px solid salmon;
|
|
padding: 5px;
|
|
}
|
|
td {
|
|
border: 5px solid orange;
|
|
}
|
|
.child {
|
|
display: inline-block;
|
|
width: 50px;
|
|
height: 20px;
|
|
background-color: pink;
|
|
}
|
|
.collapse {
|
|
border-collapse: collapse;
|
|
}
|
|
</style>
|
|
|
|
<table data-expected-width=140>
|
|
<td data-expected-width=116>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<table style="width: min-content" data-expected-width=86>
|
|
<td data-expected-width=62>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<table style="width: max-content" data-expected-width=140>
|
|
<td data-expected-width=116>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<table style="width: fit-content" data-expected-width=140>
|
|
<td data-expected-width=116>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<div style="width: 140px">
|
|
<table style="width: fit-content" data-expected-width=140>
|
|
<td data-expected-width=116>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="width: 139px">
|
|
<table style="width: fit-content" data-expected-width=139>
|
|
<td data-expected-width=115>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="width: 400px">
|
|
<table style="width: -webkit-fill-available" data-expected-width=400>
|
|
<td data-expected-width=376>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
<div>
|
|
|
|
<table class="collapse" data-expected-width=116>
|
|
<td data-expected-width=111>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<table class="collapse" style="width: min-content" data-expected-width=62>
|
|
<td data-expected-width=57>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<table class="collapse" style="width: max-content" data-expected-width=116>
|
|
<td data-expected-width=111>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<table class="collapse" style="width: fit-content" data-expected-width=116>
|
|
<td data-expected-width=111>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
|
|
<div style="width: 116px">
|
|
<table class="collapse" style="width: fit-content" data-expected-width=116>
|
|
<td data-expected-width=111>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="width: 115px">
|
|
<table class="collapse" style="width: fit-content" data-expected-width=115>
|
|
<td data-expected-width=110>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="width: 400px">
|
|
<table class="collapse" style="width: -webkit-fill-available" data-expected-width=400>
|
|
<td data-expected-width=395>
|
|
<div class="child"></div>
|
|
<div class="child"></div>
|
|
</td>
|
|
</table>
|
|
<div>
|
|
|
|
<script src="../../resources/check-layout.js"></script>
|
|
<script>
|
|
checkLayout('table');
|
|
</script> |