display-block-baselines-2-ref.html (2045B)
1 <!DOCTYPE HTML> 2 <!-- 3 Any copyright is dedicated to the Public Domain. 4 http://creativecommons.org/publicdomain/zero/1.0/ 5 --> 6 <html><head> 7 <meta charset="utf-8"> 8 <title>Reference: Testcase #2 for bug 1330962</title> 9 <style type="text/css"> 10 html,body { 11 color:black; background-color:white; font:16px/1 monospace; padding:0; margin:0; 12 } 13 * { font:16px/1 monospace; } 14 15 .block { display: block; } 16 .grid { display: grid; } 17 18 .no-theme { 19 -moz-appearance: none; 20 -webkit-appearance: none; 21 appearance: none; 22 padding: 20px 0; 23 border: none; 24 background: white; 25 color: black; 26 text-align: start; 27 } 28 29 .scroll { 30 overflow-y: scroll; 31 } 32 33 .no-scroll { 34 overflow: visible; 35 } 36 37 </style> 38 </head> 39 <body> 40 41 <div> 42 <div style="display:inline-block"> 43 A<div> 44 <div style="display:inline-block"><input type="button" value="button"></div></div> 45 </div> 46 B 47 </div> 48 49 <div> 50 <div style="display:inline-block"> 51 A<br> 52 <div style="display:inline-block"><button>button</button></div> 53 </div> 54 B 55 </div> 56 57 <div> 58 <div style="display:inline-block"> 59 A<br> 60 <div style="display:inline-block"><input class="no-theme" type="button" value="button"></div> 61 </div> 62 B 63 </div> 64 65 <div> 66 <div style="display:inline-block"> 67 A<br> 68 <button class="no-theme">button-first<div style="font-size:10px">button-last</div></button> 69 </div> 70 B 71 <div class="no-theme" style="display:inline-block">button-first<div style="font-size:10px">button-last</div></div> 72 </div> 73 74 <div> 75 <div style="display:inline-block"> 76 A<br> 77 <button class="no-theme" style="display:inline-grid">button-first<x style="font-size:10px">button-last</x></button> 78 </div> 79 B 80 <div class="no-theme" style="display:inline-grid">button-first<x style="font-size:10px">button-last</x></div> 81 </div> 82 83 <div> 84 <div style="display:inline-grid"> 85 A 86 <input type="checkbox" class="block" checked> 87 </div> 88 B 89 </div> 90 91 <div> 92 <div style="display:inline-grid"> 93 A 94 <input type="radio" class="block" checked> 95 </div> 96 B 97 </div> 98 99 </body> 100 </html>