<relative-size>

<relative-size> = smaller | larger 

The <relative-size> data type is defined using a keyword value chosen from the list below.

smaller

A relative size one size smaller than the inherited size.

larger

A relative size one size larger than the inherited size.

The <relative-size> keywords are relative to the current size of the element. If the inherited size is defined using an <absolute-size> keyword, the <relative-size> value equates to the adjacent size in the <absolute-size> table. Otherwise, the relative increase or decrease in size is between 120% and 150%.

<ul> <li class="smaller">font-size: smaller;</li> <li>font-size is not specified</li> <li class="larger">font-size: larger;</li> </ul> 

li { margin-bottom: 0.3em; } .smaller { font-size: smaller; } .larger { font-size: larger; } 

Result

• CSS <absolute-size> data type
• CSS font and font-size properties
• CSS fonts module