title: divide row into two equal columns using two spans
body: <p>Following is  my simple html:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;span style="display:inline-block;width:49%;text-align:center"&gt; some text&lt;/span&gt;
                   &lt;span style="display:inline-block;width:49%;text-align:center"&gt; some text&lt;/span&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I want row to be divided into 2 equal space/columns but when I use 50% width, second span comes to the next row.</p>
  
  <p><strong>What I did?</strong> </p>
  
  <p>fixed both widths to 49% then it is working but I want space to be equally divided using 50%.</p>
  
  <p>What am I missing?</p>