title: Why does this html border only have 3 sides?
body: <p>Why does:</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
    &lt;style&gt;
      #categorizer { border-style: solid; border-width: 10px; 
                     border-color: blue; padding: 50px }
      #children { color: green; background-color: yellow }
      #parents { color: blue; background-color: #ccc }
    &lt;/style&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;span id="categorizer"&gt;
        &lt;span id="children"&gt;
          &lt;span class="child"&gt;c11111&lt;/span&gt;
          &lt;span class="child"&gt;c22222&lt;/span&gt;
          &lt;span class="child"&gt;c33333&lt;/span&gt;
          &lt;span class="child"&gt;c44444&lt;/span&gt;
          &lt;span class="child"&gt;c55555&lt;/span&gt;
        &lt;/span&gt;
        &lt;span id="parents"&gt;
          &lt;span class="parent"&gt;pAAA&lt;/span&gt;
          &lt;span class="parent"&gt;pBBB&lt;/span&gt;
        &lt;/span&gt;
      &lt;/span&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>only give me three border sides, i.e. </p>
  
  <p><img src="https://i.stack.imgur.com/uibBT.png" alt="enter image description here"></p>