title: Align paragraphs to left and right, and center image on footer
body: <p>I need to display one paragraph aligned to the left, another paragraph aligned to the right, and a centered image, all on the same line on the footer of a webpage. </p>
  
  <p>How do I achieve that? My current code gets the second paragraph on a new line.</p>
  
  <h3>HTML</h3>
  
  <pre><code>&lt;div id="footer"&gt;
      &lt;p class="alignleft"&gt;Text&lt;/p&gt;
      &lt;img id="logo" src="#"&gt;
      &lt;p class="alignright"&gt;More text&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <h3>CSS</h3>
  
  <pre><code>.alignleft {
      float: left;
  }
  
  .alignright {
      float: right;
  }
  
  #logo {
      display: block;
      margin-left: auto;
      margin-right: auto;
  }
  </code></pre>