title: Border top and bottom without triangle cut
body: <p>I need to create two Horizontal line and between them there is a centered word.
  I create this code:</p>
  
  <p>html:</p>
  
  <pre><code>&lt;div class="myRow"&gt;preference&lt;/div&gt;
  </code></pre>
  
  <p>css:</p>
  
  <pre><code>.myRow
   {color:red;
    text-align:center;
    border-style:solid;
    border-width:medium;
    border-color:#b2b2ac white #b2b2ac white;}
  </code></pre>
  
  <p>Unfortunately, the top border and bottom border are not straight at the ends.</p>
  
  <p>How can I get the perfect rectangle border on the top and bottom of the box?</p>