title: html css make div be on the same line as text
body: <p>My question is, how do I avoid having the text on a new row?</p>
  
  <p>My code:</p>
  
  <pre><code>&lt;html&gt;
  &lt;body&gt;
  &lt;p &gt;Seating availability.&lt;/p&gt;
  &lt;p &gt;&lt;div style="width: 10px; height: 10px; background-color: green; border: 0px;" &gt;&lt;/div&gt; There are available seats.&lt;/p&gt;
  &lt;p &gt;&lt;div style="width: 10px; height: 10px; background-color: yellow; border: 0px;" &gt;&lt;/div&gt; Available seats are decreasing.&lt;/p&gt;
  &lt;p &gt;&lt;div style="width: 10px; height: 10px; background-color: orange; border: 0px;" &gt;&lt;/div&gt; Less than 15% of seats available.&lt;/p&gt;
  &lt;p &gt;&lt;div style="width: 10px; height: 10px; background-color: red; border: 0px;" &gt;&lt;/div&gt; There are no available seats.&lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>How should I code this?</p>