title: Text wrapping under label on new line
body: <p>I have a page, a confirmation page.</p>
  
  <p>On the left side <code>&lt;label&gt;</code>, in the middle <code>padding</code>, and on the right <code>&lt;span&gt;</code></p>
  
  <p>The text in the span, when too long, wraps underneath the label, instead of under the width of the label, like an <code>inline-block</code>.</p>
  
  <pre><code>&lt;label&gt;Label1:&lt;/label&gt;
  &lt;span class="class"&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit,&lt;/span&gt;
  &lt;label&gt;Label2:&lt;/label&gt;
  &lt;span class="class"&gt; sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, &lt;/span&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>label, span {
       width: 45%
  }
  label {
       float: left;
  }
  </code></pre>
  
  <p>How can I make it such that the CSS is 45% and on multiple lines?</p>