third_party/WebKit/LayoutTests/fast/table/table-size-must-consider-stretch-alignment.html - Issue 2528253003: [table] Stretching tables when needed due to self-alignment properties

Side by Side Diff: third_party/WebKit/LayoutTests/fast/table/table-size-must-consider-stretch-alignment.html

Issue 2528253003: [table] Stretching tables when needed due to self-alignment properties (Closed)

Patch Set: Applied additional suggested changes. Created 3 years, 11 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

« no previous file with comments | « third_party/WebKit/LayoutTests/css3/flexbox/flexitem-expected.txt ('k') | third_party/WebKit/Source/core/layout/LayoutBox.h » ('j') | third_party/WebKit/Source/core/layout/LayoutBox.h » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!DOCTYPE HTML>

	2 <script src="../../resources/testharness.js"></script>

	3 <script src="../../resources/testharnessreport.js"></script>

	4 <script src="../../resources/check-layout-th.js"></script>

	5 <style>

	6 .block {

	7 width: 200px;

	8 height: 200px;

	9 background: lightgrey;

	10 }

	11

	12 .flex { display: flex; }

	13 .grid {

	14 display: grid;

	15 grid: 100px / 150px;

	16 }

	17

	18 .itemsStart {

	19 align-items: start;

	20 justify-items: start;

	21 }

	22 .itemsFlexStart {

	23 align-items: flex-start;

	24 justify-items: flex-start;

	25 }

	26

	27 .item {

	28 display: table;

	29 background: lime;

	30 border-spacing: 0px;

	31 font: 10px/1 Ahem;

	32 }

	33

	34 td { padding: 0px; }

	35 caption { background: grey; }

	36

	37 </style>

	38 <body onload="checkLayout('.block')">
	mstensho (USE GERRIT) 2017/02/22 13:37:04 Probably no need for the onload handler. How about Probably no need for the onload handler. How about just inserting a <script> at the end of the document that does checkLayout('.block') instead? jfernandez 2017/03/02 11:12:58 Done. Show quoted text On 2017/02/22 13:37:04, mstensho wrote: > Probably no need for the onload handler. How about just inserting a <script> at > the end of the document that does checkLayout('.block') instead? Done.
	39

	40 <p>This test verifies that table sizing logic considers stretch alignment when c omputing its width and height.</p>

	41

	42 <p>Regular block container of a table element and 1 implicit row and column.<br> The align-self property doesn't apply to block-level boxes.</br>The justify-self property has its initial/default value 'normal', which behaves like 'start'.</p >

	43 <div class="block">

	44 <div class="item" data-expected-width="100" data-expected-height="10">table cell</div>

	45 </div>

	46

	47 <br><br>

	48

	49 <p>Regular block container of an empty table.<br>The align-self property doesn't apply to block-level boxes.</br>The justify-self property has its initial/defau lt value 'normal', which behaves like 'start'.</p>

	50 <div class="block">

	51 <table class="item" data-expected-width="70" data-expected-height="10">

	52 <caption>caption</caption>

	53 </table>

	54 </div>

	55

	56 <br><br>

	57

	58 <p>Regular block container of a table element and 1 explicit row and column.<br> The align-self property doesn't apply to block-level boxes.</br>The justify-self property has its initial/default value 'normal', which behaves like 'start'.</p >

	59 <div class="block">

	60 <table class="item" data-expected-width="100" data-expected-height="20">

	61 <tr data-expected-width="100" data-expected-height="10">

	62 <td>table cell</td>

	63 </tr>

	64 <caption>caption</caption>

	65 </table>

	66 </div>

	67

	68 <br><br>

	69

	70 <p>Grid container of table element and 1 implicit row and column.<br>Both the al ign-self and justify-self properties have their initial/default value 'normal', which behaves like 'stretch'.</p>

	71 <div class="block grid">

	72 <div class="item" data-expected-width="150" data-expected-height="100">table cell</div>

	73 </div>

	74

	75 <br><br>

	76

	77 <p>Grid container of an empty table element.<br>Both the align-self and justify- self properties have their initial/default value 'normal', which behaves like 's tretch'.</p>

	78 <div class="block grid">

	79 <table class="item" data-expected-width="150" data-expected-height="110">

	80 <caption>caption</caption>

	81 </table>

	82 </div>

	83

	84 <br><br>

	85

	86 <p>Grid container of an empty table element.<br>Both the align-self and justify- self properties have a value 'start', which should prevent the item to be stretc hed.</p>

	87 <div class="block grid itemsStart">

	88 <table class="item" data-expected-width="70" data-expected-height="10">

	89 <caption>caption</caption>

	90 </table>

	91 </div>

	92

	93 <br><br>

	94

	95 <p>Grid container of table element and 1 explicit row and column.<br>Both the al ign-self and justify-self properties have their initial/default value 'normal', which behaves like 'stretch'.</p>

	96 <div class="block grid">

	97 <table class="item" data-expected-width="150" data-expected-height="110">

	98 <tr data-expected-width="150" data-expected-height="100">

	99 <td>table cell</td>

	100 </tr>

	101 <caption>caption</caption>

	102 </table>

	103 </div>

	104

	105 <br><br>

	106

	107 <p>Flex container of table element and 1 implicit row and column.<br>Both the al ign-self and justify-self properties have their initial/default value 'normal', which behaves like 'stretch'.</p>

	108 <div class="block flex">

	109 <div class="item" class="item" data-expected-width="200" data-expected-heigh t="200">table cell</div>

	110 </div>

	111

	112 <br><br>

	113

	114 <p>Flex container of an empty table element.<br>Both the align-self and justify- self properties have their initial/default value 'normal', which behaves like 's tretch'.</p>

	115 <div class="block flex">

	116 <table class="item" data-expected-width="200" data-expected-height="210">

	117 <caption>caption</caption>

	118 </table>

	119 </div>

	120

	121 <br><br>

	122

	123 <p>Flex container of an empty table element.<br>Both the align-self and justify- self properties have a value 'start', which should prevent the item to be stretc hed.</p>

	124 <div class="block flex itemsFlexStart">

	125 <table class="item" data-expected-width="70" data-expected-height="10">

	126 <caption>caption</caption>

	127 </table>

	128 </div>

	129

	130 <br><br>

	131

	132 <p>Flex container of table element and 1 explicit row and column.<br>Both the al ign-self and justify-self properties have their initial/default value 'normal', which behaves like 'stretch'.</p>

	133 <div class="block flex">

	134 <table class="item" class="item" data-expected-width="200" data-expected-hei ght="210">

	135 <tr data-expected-width="200" data-expected-height="200">

	136 <td>table cell</td>

	137 </tr>

	138 <caption>caption</caption>

	139 </table>

	140 </div>

	141

	142 </body>

	143 </html>
	mstensho (USE GERRIT) 2017/02/22 13:37:04 No HTML start tag found. We usually avoid explicit No HTML start tag found. We usually avoid explicit HTML and BODY elements in our tests. jfernandez 2017/03/02 11:12:58 Done. Show quoted text On 2017/02/22 13:37:04, mstensho wrote: > No HTML start tag found. We usually avoid explicit HTML and BODY elements in our > tests. Done.
OLD	NEW