dualclass.html

<html><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><title>meyer's 5.8.3 chart selector issue</title><style type="text/css">/*  body,p,td {  font-family : verdana,sans-serif;  font-size : 14px;  letter-spacing : 1px;  line-height : 18px; } */ .outside {  font-family : 'times new roman',serif;  color: red; } .inside {  font-family : 'andale mono',monospace;  color: green; } /* according to rule 5.8.3 as I see it, the following class*/ .outside.inside {  font-size : 200%;  line-height : 130%;  color: purple; } /* for demonstrating the use of two separate classes todefine a single class */ .insidesep {  font-size : 300%;  line-height : 160%;  color: blue; }</style></head><body id="www-meyerweb-com" class="css"><p>The Fox Jumped Over The Lazy Dog.</p><p class="outside">(1) This sentence has a class in the &lt;p&gt; element, '.outside'.</p><p class="inside">(2) This sentence has a class in the &lt;p&gt; element, '.inside'.</p><p class="outside">(3) This sentence has a class in the &lt;p&gt; element ('.outside') <span class="inside">but this inline &lt;span&gt; has the '.inside' class in it.</span></p><p class="outside inside">(4) This sentence has both the '.outside' and '.inside' classes attributed to the &lt;p&gt; element.</p><p class="outside insidesep">(5) This sentence has both the '.outside' and '.insidesep' classes attributed to the &lt;p&gt; element.</p></body></html>