Chromium Code Reviews Chromium Code Reviews
Issue 22589002:
Margins on children of display:table-cell elements get stuck at highest value. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <!DOCTYPE html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <title></title> | |
| 5 <script> | |
| 6 function main() | |
| 7 { | |
| 8 if (window.testRunner) { | |
| 9 testRunner.waitUntilDone(); | |
| 10 } | |
| 11 setTimeout(funRemoveClass, 0); | |
|
ojan
2013/08/07 23:03:12
I think you can do this without a setTimeout. See
a.suchit
2013/08/08 10:19:29
Change into Ref Test.
| |
| 12 } | |
| 13 /*function buttonClick() | |
|
ojan
2013/08/07 23:03:12
Please remove dead code.
| |
| 14 { | |
| 15 var interval = setInterval(function () {document.getElementById("myB uttonId").click(); clearInterval(interval);}, 0); | |
| 16 }*/ | |
| 17 function funRemoveClass() | |
| 18 { | |
| 19 document.getElementById("removeClass").className = ""; | |
| 20 document.getElementById("sibling").className = ""; | |
| 21 document.getElementById("nextSibling").className = ""; | |
| 22 //alert("class removed."); | |
| 23 setTimeout("testRunner.notifyDone()", 0); | |
| 24 } | |
| 25 </script> | |
| 26 <style> | |
| 27 #sibling { outline: 1px solid red; } | |
| 28 .cell { outline: 1px solid blue; } | |
| 29 .cell p { outline:1px solid green; } | |
| 30 | |
| 31 .table { display:table; } | |
| 32 .cell { display:table-cell; } | |
| 33 | |
| 34 #myButtonId { visibility:hidden; } | |
| 35 | |
| 36 p { margin:0; } | |
| 37 p.margin { margin: 40px 0; } | |
| 38 </style> | |
| 39 </head> | |
| 40 <body onload="main()"> | |
| 41 <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issu es/detail?id=241331">241331</a>. Margins on children of display:table-cell eleme nts get stuck at highest value.</h3> | |
| 42 <h4>Row's before margin was not reseting back to 0 when margin of the cell's child is changed from 40px to 0.</h4> | |
| 43 <!--button id="myButtonId" onclick="funRemoveClass()">Toggle paragraph paddi ng</button--> | |
| 44 <p id="sibling" class="margin">Paragraph1 : None of the paragraphs have any margins.</p> | |
| 45 | |
| 46 <div class="table"> | |
| 47 <div class="cell">other cell, no paragraph</div> | |
| 48 <div class="cell"><p id="removeClass" class="margin">Paragraph2 : I am i n a table cell</p></div> | |
| 49 </div> | |
| 50 <p id="nextSibling" class="margin">Paragraph3 : text after</p> | |
| 51 </body> | |
| 52 </html> | |
| OLD | NEW |
