layout/reftests/bugs/966992-1-ref.html@141e0f1194b1 (annotated)
layout/reftests/bugs/966992-1-ref.html
Wed, 31 Dec 2014 07:16:47 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 07:16:47 +0100
- branch
- TOR_BUG_9701
- changeset 3
- 141e0f1194b1
- permissions
- -rw-r--r--
Revert simplistic fix pending revisit of Mozilla integration attempt.
| michael@0 | 1 | <!DOCTYPE HTML> |
| michael@0 | 2 | <html class="reftest-wait"><head> |
| michael@0 | 3 | <meta charset="utf-8"> |
| michael@0 | 4 | <title>Testcases for overflow-clip-box:content-box</title> |
| michael@0 | 5 | <style type="text/css"> |
| michael@0 | 6 | font-face { |
| michael@0 | 7 | font-family: DejaVuSansMono; |
| michael@0 | 8 | src: url(../fonts/DejaVuSansMono.woff),url(DejaVuSansMono.woff); |
| michael@0 | 9 | } |
| michael@0 | 10 | |
| michael@0 | 11 | html,body { |
| michael@0 | 12 | color:black; background-color:white; font:16px DejaVuSansMono!important; padding:0; margin:7px; |
| michael@0 | 13 | } |
| michael@0 | 14 | |
| michael@0 | 15 | input { |
| michael@0 | 16 | width: 100px; padding:50px; -moz-appearance:none; overflow-clip-box:padding-box; |
| michael@0 | 17 | border: 3px solid black; |
| michael@0 | 18 | } |
| michael@0 | 19 | textarea, #textarea { |
| michael@0 | 20 | width: 160px; height:110px; padding:40px; overflow:scroll; -moz-appearance:none; overflow-clip-box:padding-box; |
| michael@0 | 21 | border: 3px solid black; |
| michael@0 | 22 | } |
| michael@0 | 23 | #textarea { word-break: break-all; font:14px DejaVuSansMono!important; } |
| michael@0 | 24 | |
| michael@0 | 25 | |
| michael@0 | 26 | p { |
| michael@0 | 27 | position:absolute; |
| michael@0 | 28 | margin:0; |
| michael@0 | 29 | width:70%; |
| michael@0 | 30 | height: 1px; |
| michael@0 | 31 | background:magenta; |
| michael@0 | 32 | } |
| michael@0 | 33 | .rel p { width:200%; } |
| michael@0 | 34 | .block { |
| michael@0 | 35 | border:1px solid grey; height:50px; width:200px; padding:20px; |
| michael@0 | 36 | overflow:auto; overflow-clip-box:padding-box; |
| michael@0 | 37 | } |
| michael@0 | 38 | .rel { position:relative; } |
| michael@0 | 39 | .mask1 { position:absolute; width:20px; background:white; top:0; bottom:0; right:0; } |
| michael@0 | 40 | .mask2 { position:absolute; width:20px; background:white; top:0px; bottom:-15px; right:220px; z-index:99; } |
| michael@0 | 41 | .mask3 { position:absolute; width:20px; background:white; top:0; bottom:0; left:200px; } |
| michael@0 | 42 | .mask4 { position:absolute; height:40px; background:white; top:4px; left:3px; width:210px; z-index:99; } |
| michael@0 | 43 | .mask5 { position:absolute; height:40px; background:white; top:3px; right:3px; width:50px; } |
| michael@0 | 44 | .button { width:100px; padding:0 50px; overflow:hidden; } |
| michael@0 | 45 | </style> |
| michael@0 | 46 | <script> |
| michael@0 | 47 | function runTest() { |
| michael@0 | 48 | // the timeout is for avoiding differences in scrollbar fading |
| michael@0 | 49 | document.documentElement.removeAttribute("class"); |
| michael@0 | 50 | } |
| michael@0 | 51 | </script> |
| michael@0 | 52 | </head> |
| michael@0 | 53 | <body onload="setTimeout(runTest,5000)"> |
| michael@0 | 54 | |
| michael@0 | 55 | <div class="rel block">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX<p style="padding-right:20px"></p><div class=mask1></div></div> |
| michael@0 | 56 | <div style="float:right"> |
| michael@0 | 57 | |
| michael@0 | 58 | <div class="rel block" style="box-sizing:border-box;height:90px"><span style="padding-right:20px">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span><div class=mask1></div></div> |
| michael@0 | 59 | |
| michael@0 | 60 | </div> |
| michael@0 | 61 | |
| michael@0 | 62 | <div class="rel block"><span style="padding-right:20px">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span><p></p><div class=mask1></div></div> |
| michael@0 | 63 | <div id="d1" class="rel block"><span style="padding-right:20px">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span><span style="position:relative;"><div class=mask2></div><div class=mask1></div></span><p></p></div> |
| michael@0 | 64 | <script> |
| michael@0 | 65 | document.getElementById("d1").scrollLeft = "100000"; |
| michael@0 | 66 | </script> |
| michael@0 | 67 | <div class="block"><span style="padding-right:20px"><span style="position:relative;"><div class=mask3></div>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span></span><p></p></div> |
| michael@0 | 68 | |
| michael@0 | 69 | <span style="position:relative"><input spellcheck=false type="text" placeholder="someveryveryveryveryverylongvalue"><div class=mask5></div></span> |
| michael@0 | 70 | <span style="position:relative"><input spellcheck=false type="text" value="someveryveryveryveryverylongvalue"><div class=mask5></div></span><br> |
| michael@0 | 71 | <span style="position:relative"><input spellcheck=false type="password" value="someveryveryveryveryverylongpassword"><div class=mask5></div></span> |
| michael@0 | 72 | <span style="position:relative"><input spellcheck=false type="email" value="someveryveryveryveryverylongvalue"><div class=mask5></div></span> |
| michael@0 | 73 | <span style="position:relative"><input spellcheck=false type="blah" value="someveryveryveryveryverylongvalue"><div class=mask5></div></span> |
| michael@0 | 74 | <br> |
| michael@0 | 75 | <input spellcheck=false type="button" value="button" class="button" style="overflow-clip-box:initial"> |
| michael@0 | 76 | <input spellcheck=false type="button" value="button" class="button"> |
| michael@0 | 77 | <input spellcheck=false type="reset" class="button"> |
| michael@0 | 78 | <input spellcheck=false type="submit" class="button"><br> |
| michael@0 | 79 | <input spellcheck=false type="button" value="" class="button"> |
| michael@0 | 80 | <input spellcheck=false type="reset" value="" class="button"> |
| michael@0 | 81 | <input spellcheck=false type="submit" value="" class="button"><br> |
| michael@0 | 82 | |
| michael@0 | 83 | </body> |
| michael@0 | 84 | </html> |
