title: Text align left in a span
body: <p>I have a paragraph split up as follows: </p>
  
  <pre><code>&lt;a href="#" class="nostyle"&gt;
    &lt;p&gt;
      &lt;span class="heading"&gt;Really long heading&lt;/span&gt;&lt;br&gt;
      &lt;br&gt;
      Lots of text that needs to be justified
    &lt;/p&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>The paragraph is set to <code>text-align: justify</code>, which it needs to stay at. 
  I want just the <code>&lt;span&gt;</code> to be <code>text-align: left</code>, so that large gaps don't form between rows. How can I do this? </p>
  
  <p>I want to keep it all as a single paragraph, as it's part of a flex item and having a <code>&lt;h2&gt;</code> and <code>&lt;p&gt;</code> means it won't all work nicely!</p>
  
  <p>Thanks. </p>