blob: 709d48be3a458078c29061408b9a2fc18ae0f01d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
<!DOCTYPE html>
<style>
.styledForTest {
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: orange;
color: white;
border: 7px solid black;
padding: 5px;
width: 80px;
height: 30px;
margin: 2px;
}
</style>
<p id="description">All of the boxes should be 80x30 and look identical.</p>
<div id="console"></div>
<div id="expected" class="styledForTest"></div>
<div id="div-display-table-cell" class="styledForTest" style="display: table-cell;"></div>
<table>
<tr>
<td id="td" class="styledForTest"></td>
</tr>
</table>
<script src="../../resources/js-test.js"></script>
<script>
description('Tests that display: table-cell and box-sizing: border-box work when used together.');
['div-display-table-cell', 'td'].forEach(function (id) {
debug(id);
element = document.querySelector('#' + id);
shouldBe('element.offsetWidth', '80');
shouldBe('element.offsetHeight', '30');
});
</script>
|
