title: How to adjust the width of a horizontal rule element
body: <p>I've got a problem with setting the width of <code>&lt;hr&gt;</code> elements. I mean I want my <code>&lt;hr&gt;</code> to be displayed half of the full width like this image:</p>
  <p><a href="https://i.stack.imgur.com/oxh45.png" rel="noreferrer"><img src="https://i.stack.imgur.com/oxh45.png" alt="enter image description here" /></a></p>
  <p>As you can see the <code>&lt;hr&gt;</code> element is between the <code>&lt;h1&gt;</code> tag and paragraph and it's half of screen full width.</p>
  <p>I have searched and all I got was to setting the <code>&lt;hr&gt;</code> element like this:</p>
  <pre><code>&lt;hr size=&quot;30&quot;&gt;
  </code></pre>
  <p>But that just does not work. So do you know how to set the width of <code>&lt;hr&gt;</code> element?</p>