title: How to position three divs in html horizontally?
body: <p>I am creating a sample website which has three divisions horizontally.
  I want the left most div to be 25% width, the middle one to be 50% width, and right to be 25% width so that the divisions fill all the 100% space horizontally.</p>
  
  <pre><code>&lt;html&gt;
      &lt;title&gt;
      Website Title
      &lt;/title&gt;
  
      &lt;div id="the whole thing" style="height:100%; width:100%" &gt;
  
          &lt;div id="leftThing" style="position: relative; width:25%; background-color:blue;"&gt;
              Left Side Menu
          &lt;/div&gt;
  
          &lt;div id="content" style="position: relative; width:50%; background-color:green;"&gt;
              Random Content
          &lt;/div&gt;
  
          &lt;div id="rightThing" style="position: relative; width:25%; background-color:yellow;"&gt;
              Right Side Menu
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><a href="https://imgur.com/j4cJu" rel="noreferrer">http://imgur.com/j4cJu</a></p>
  
  <p>When I execute this code, the divs appear over each other. I want them to appear beside each other!</p>
  
  <p>How can i do this?</p>