title: Half circle with CSS (border, outline only)
body: <p>I'm trying to create a circle with CSS, which looks exactly like on the following picture:</p>
  
  <p><img src="https://i.stack.imgur.com/Rt3yC.png" alt="enter image description here"></p>
  
  <p>...with only one <code>div</code>:</p>
  
  <pre><code>&lt;div class="myCircle"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and by using <strong>only CSS</strong> definitions. No SVG, WebGL, DirectX, [...] allowed.</p>
  
  <p>I've tried to draw a full circle and fading half of it with another <code>div</code>, and it does work, but I'm looking for a more elegant alternative.</p>