text-decoration-thickness-length-rounding-min-val.html (4854B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title> 5 CSS Text Decoration Test: text-decoration-thickness length min rounding 6 </title> 7 8 <link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org"> 9 <link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-width-property"> 10 <link rel="match" href="reference/text-decoration-thickness-length-rounding-min-val-ref.html"> 11 12 <meta name="assert" content="text-decoration-thickness length is rounded up to 1px"> 13 14 <style> 15 table { 16 border: 3px solid gray; 17 border-collapse: collapse; 18 } 19 20 th, 21 td{ 22 border: 2px solid gray; 23 padding: 10px; 24 text-align: center; 25 } 26 27 .point3_px { 28 text-decoration-thickness: 0.3px; 29 } 30 31 .solid { 32 text-decoration-style: solid; 33 } 34 35 .double { 36 text-decoration-style: double; 37 } 38 39 .dotted { 40 text-decoration-style: dotted; 41 } 42 43 .dashed { 44 text-decoration-style: dashed; 45 } 46 47 .wavy { 48 text-decoration-style: wavy; 49 } 50 51 .underline { 52 text-decoration-line: underline; 53 } 54 55 .line_through { 56 text-decoration-line: line-through; 57 } 58 59 .overline { 60 text-decoration-line: overline; 61 } 62 </style> 63 </head> 64 65 <body> 66 <h1> 67 Test passes if text-decoration-thickness length is rounded up to 1px 68 </h1> 69 70 <table> 71 <thead> 72 <tr> 73 <th rowspan="2"> 74 Line Type 75 </th> 76 <th colspan="5"> 77 Line Style 78 </th> 79 </tr> 80 <tr> 81 <th> 82 Solid 83 </th> 84 <th> 85 Double 86 </th> 87 <th> 88 Dotted 89 </th> 90 <th> 91 Dashed 92 </th> 93 <th> 94 Wavy 95 </th> 96 </tr> 97 </thead> 98 <tbody> 99 <tr> 100 <th> 101 Underline 102 </th> 103 <td class="point3_px solid underline"> 104 Thickness test. 105 </td> 106 <td class="point3_px double underline"> 107 Thickness test. 108 </td> 109 <td class="point3_px dotted underline"> 110 Thickness test. 111 </td> 112 <td class="point3_px dashed underline"> 113 Thickness test. 114 </td> 115 <td class="point3_px wavy underline"> 116 Thickness test. 117 </td> 118 </tr> 119 <tr> 120 <th> 121 Line-through 122 </th> 123 <td class="point3_px solid line_through"> 124 Thickness test. 125 </td> 126 <td class="point3_px double line_through"> 127 Thickness test. 128 </td> 129 <td class="point3_px dotted line_through"> 130 Thickness test. 131 </td> 132 <td class="point3_px dashed line_through"> 133 Thickness test. 134 </td> 135 <td class="point3_px wavy line_through"> 136 Thickness test. 137 </td> 138 </tr> 139 <tr> 140 <th> 141 Overline 142 </th> 143 <td class="point3_px solid overline"> 144 Thickness test. 145 </td> 146 <td class="point3_px double overline"> 147 Thickness test. 148 </td> 149 <td class="point3_px dotted overline"> 150 Thickness test. 151 </td> 152 <td class="point3_px dashed overline"> 153 Thickness test. 154 </td> 155 <td class="point3_px wavy overline"> 156 Thickness test. 157 </td> 158 </tr> 159 </tbody> 160 </table> 161 </body> 162 </html>