| <!DOCTYPE html> |
| <html> |
| <head> |
| <title> |
| CSS Text Decoration Test: text-decoration-thickness length min rounding |
| </title> |
| |
| <link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org"> |
| <link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-width-property"> |
| <link rel="match" href="reference/text-decoration-thickness-length-rounding-min-val-ref.html"> |
| |
| <meta name="assert" content="text-decoration-thickness length is rounded up to 1px"> |
| |
| <style> |
| table { |
| border: 3px solid gray; |
| border-collapse: collapse; |
| } |
| |
| th, |
| td{ |
| border: 2px solid gray; |
| padding: 10px; |
| text-align: center; |
| } |
| |
| .point3_px { |
| text-decoration-thickness: 0.3px; |
| } |
| |
| .solid { |
| text-decoration-style: solid; |
| } |
| |
| .double { |
| text-decoration-style: double; |
| } |
| |
| .dotted { |
| text-decoration-style: dotted; |
| } |
| |
| .dashed { |
| text-decoration-style: dashed; |
| } |
| |
| .wavy { |
| text-decoration-style: wavy; |
| } |
| |
| .underline { |
| text-decoration-line: underline; |
| } |
| |
| .line_through { |
| text-decoration-line: line-through; |
| } |
| |
| .overline { |
| text-decoration-line: overline; |
| } |
| </style> |
| </head> |
| |
| <body> |
| <h1> |
| Test passes if text-decoration-thickness length is rounded up to 1px |
| </h1> |
| |
| <table> |
| <thead> |
| <tr> |
| <th rowspan="2"> |
| Line Type |
| </th> |
| <th colspan="5"> |
| Line Style |
| </th> |
| </tr> |
| <tr> |
| <th> |
| Solid |
| </th> |
| <th> |
| Double |
| </th> |
| <th> |
| Dotted |
| </th> |
| <th> |
| Dashed |
| </th> |
| <th> |
| Wavy |
| </th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr> |
| <th> |
| Underline |
| </th> |
| <td class="point3_px solid underline"> |
| Thickness test. |
| </td> |
| <td class="point3_px double underline"> |
| Thickness test. |
| </td> |
| <td class="point3_px dotted underline"> |
| Thickness test. |
| </td> |
| <td class="point3_px dashed underline"> |
| Thickness test. |
| </td> |
| <td class="point3_px wavy underline"> |
| Thickness test. |
| </td> |
| </tr> |
| <tr> |
| <th> |
| Line-through |
| </th> |
| <td class="point3_px solid line_through"> |
| Thickness test. |
| </td> |
| <td class="point3_px double line_through"> |
| Thickness test. |
| </td> |
| <td class="point3_px dotted line_through"> |
| Thickness test. |
| </td> |
| <td class="point3_px dashed line_through"> |
| Thickness test. |
| </td> |
| <td class="point3_px wavy line_through"> |
| Thickness test. |
| </td> |
| </tr> |
| <tr> |
| <th> |
| Overline |
| </th> |
| <td class="point3_px solid overline"> |
| Thickness test. |
| </td> |
| <td class="point3_px double overline"> |
| Thickness test. |
| </td> |
| <td class="point3_px dotted overline"> |
| Thickness test. |
| </td> |
| <td class="point3_px dashed overline"> |
| Thickness test. |
| </td> |
| <td class="point3_px wavy overline"> |
| Thickness test. |
| </td> |
| </tr> |
| </tbody> |
| </table> |
| </body> |
| </html> |
