7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney<div class="intro">
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <p>This example shows how to set font sizes using percent ("%") units.</p>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney<div class="example newwindow">
b679dd193fde96c17585e0ab13bc2e345be375e6Matt Sweeney <a href="cssfonts-size-example.html" target="_blank" class="button">
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney View Example in New Window
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney<h2 class="first">About This Example</h2>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney<h3>Use These Percentages</h3>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney<div class="short" id="font-size-chart">
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <th class="first-col">If you want this size in pixels (px)</th>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <th>Declare this percent (%)</th>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">10</td><td>77</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">11</td><td>85</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">12</td><td>93</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">13</td><td>100</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">14</td><td>108</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">15</td><td>116</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">16</td><td>123.1</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">17</td><td>131</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">18</td><td>138.5</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">19</td><td>146.5</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">20</td><td>153.9</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">21</td><td>161.6</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">22</td><td>167</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">23</td><td>174</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">24</td><td>182</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="even"><td class="first-col">25</td><td>189</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney <tr class="odd"><td class="first-col">26</td><td>197</td></tr>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney<h2>Note:</h2>
7b8680288e79cc11a4c20b66ce5c167619f1431fMatt Sweeney<p>Because CSS examples are susceptible to other CSS on the page, this example is only available in a new window at the above link.</p>