title: Table cell borders with multiple thicknesses (or a div boundary)?
body: <p>I know how to have a border set with a style of <strong>double</strong> on a table cell or div boundary.</p>
  <p>But how about this (extract from Microsoft Word):</p>
  <p><a href="https://i.stack.imgur.com/AvAwz.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AvAwz.jpg" alt="Extract from Microsoft Word" /></a></p>
  <p>It has a thick and thin border. Can we do this easily with HTML / CSS?</p>
  <p>Thank you.</p>
  <p>Update:</p>
  <p>Here is some sample HTML:</p>
  <pre><code>&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD HTML 4.01 Transitional//EN&quot; &quot;http://www.w3.org/TR/html4/loose.dtd&quot;&gt;
  &lt;html&gt;
  
  &lt;head&gt;
  &lt;meta content=&quot;en-gb&quot; http-equiv=&quot;Content-Language&quot;&gt;
  &lt;meta content=&quot;text/html; charset=utf-8&quot; http-equiv=&quot;Content-Type&quot;&gt;
  &lt;title&gt;Untitled 1&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;div style=&quot;border-bottom:1px black double&quot;&gt;
      SAMPLE TEXT&lt;/div&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  <p>It will generate a double line, but with both lines having the <strong>same</strong> thickness.</p>
  <p>In the Microsoft Word example it has two lines, but one is thicker. See? Can we do this with CSS/HTML?</p>