title: Microsoft Edge CSS text-align
body: <p>Is it only me or there is quite an annoying bug in Windows 10 Edge browser?</p>
  
  <p>I have just realized that text-align isn't working as expected in Edge.</p>
  
  <p>I have</p>
  
  <pre><code>&lt;div style='text-align:justify;'&gt;
  &lt;h3&gt; This is a short text &lt;/h3&gt;
  &lt;div class='small_box'&gt;some content &lt;/div&gt;
  &lt;div class='small_box'&gt;some content &lt;/div&gt;
  &lt;div class='small_box'&gt;some content &lt;/div&gt;
  etc...
  &lt;div class='small_box'&gt;some content &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This will normally produce make the child div justify inside the parent div, and the H3 (header) where the width is much lower than the width of the parent div to be aligned to the left, works on all browsers, but in Edge, the whole content of H3 is stretched to match the width of the parent, making distance between the letters very big.</p>
  
  <p>I did some testing at it looks like it is only having this strange behaviour on certain html elements: headers (<code>h1,h2,h3</code>), <code>span</code> and <code>div</code>. If instead of a header I use a paragraph <code>&lt;p&gt;</code> then it displays as expected.</p>
  
  <p>A temporary link can be seen <a href="http://94.23.203.111/whitelabel/product_listing.php?module=smartphones" rel="nofollow">here</a> I will soon create a fiddler as well and update the link for future reference.</p>
  
  <p>Am I right in saying this is a bug in the new browser released by Microsoft?</p>