| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <title>Test rendering of sub-pixel borders</title> |
| <style> |
| .test { |
| box-sizing: content-box; |
| display: inline-block; |
| margin: 5px; |
| width: 80px; |
| height: 80px; |
| border: 1px solid green; |
| background: lightgreen; |
| vertical-align: top; |
| text-align: center; |
| line-height: 80px; |
| } |
| </style> |
| </head> |
| <body> |
| <div class="test" style="padding-top: 0.25px; border-width: 0.25px"> </div> |
| <div class="test" style="border-width: 0.5px"> </div> |
| <div class="test" style="border-width: 0.75px"> </div> |
| <div class="test" style="border-width: 1px"> </div> |
| <div class="test" style="border-width: 1.25px"> </div> |
| <br> |
| <div class="test" style="border-width: 1.5px"> </div> |
| <div class="test" style="border-width: 1.75px"> </div> |
| <div class="test" id="reference-2" style="border-width: 2px"> </div> |
| <div class="test" style="border-width: 2.25px"> </div> |
| <br> |
| <div class="test" style="border-width: 2.5px"> </div> |
| <div class="test" style="border-width: 2.75px"> </div> |
| <div class="test" id="reference-3" style="border-width: 3px"> </div> |
| <div class="test" style="border-width: 3.25px"> </div> |
| <p> |
| Border thickness should be rounded, not floored, with the exception of |
| values below 1px where it should always round up. |
| </p> |
| </body> |
| </html> |
