subpixel-borders-with-child-border-box-sizing.html (1056B)
1 <!DOCTYPE html> 2 <link rel="author" title="Stephen Chenney" href="mailto:schenney@chromium.org"> 3 <link rel="help" href="https://drafts.csswg.org/css-backgrounds-3/#border-width"> 4 <link rel="match" href="reference/subpixel-borders-with-child-border-box-sizing-ref.html"> 5 <meta name="assert" content="Sub-pixel borders should always appear, and not be 6 overdrawn by child content with box-sizing: border-box." /> 7 <head> 8 <style> 9 body { } 10 .outer { 11 border: solid .5px black; 12 background: red; 13 width: 101px; 14 height: 101px; 15 margin: 5px; 16 padding: 0px; 17 box-sizing: border-box; 18 } 19 .inner { 20 background: lightgreen; 21 padding: 0px; 22 box-sizing: border-box; 23 } 24 #inner1 { 25 width: 99px; 26 height: 99px; 27 } 28 #inner2 { 29 width: 100%; 30 height: 100%; 31 } 32 </style> 33 </head> 34 <body> 35 <div class="outer"> 36 <div class="inner" id="inner1"></div> 37 </div> 38 39 <div class="outer"> 40 <div class="inner" id="inner2"></div> 41 </div> 42 </body>