title: white space in between div elements
body: <p>I've looked at a bunch of similar questions for this problem and I still can't seem to figure out the solution (still just learning all of this stufF).</p>
  <p>I'm trying to make a portfolio website and I've placed each project inside a div element (not sure what I'm doing with the divs...). I'm having trouble removing the large amount of white space in between the divs/projects which are shown vertically, so you have to scroll down to see the next one. I've tried adjusting the margins to 0 on p, h3, and the divs with no luck. Any ideas?</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>body,
  html {
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
  }
  
  h3 {
    font-family: Helvetica, sans-serif;
    font-size: 20px;
    font-weight: normal;
  }
  
  li {
    font-family: Helvetica, sans-serif;
    font-size: 20px;
    font-weight: normal;
    list-style: none;
    line-height: normal;
  }
  
  div.movie {
    transform: scale(0.5);
    font-size: 20px;
    font-family: Helvetica;
    overflow: auto;
    width: 1200px;
    padding: 25px;
    float: left;
    clear: none;
    border-bottom: 1px solid black;
    display: block;
  }
  
  div.reader {
    transform: scale(0.5);
    font-size: 20px;
    font-family: Helvetica;
    overflow: auto;
    padding: 30px;
    float: left;
    clear: none;
    border-bottom: 1px solid black;
    display: block;
  }
  
  .main .projects {
    padding: 0;
    margin: 0;
  }
  
  div.sidebar {
    position: fixed;
    padding-top: 35px;
    font-family: Helvetica, sans-serif;
    font-size: 20px;
    margin-left: 10px;
    padding: 0;
    line-height: 40%;
    padding-top: 2%;
  }
  
  p {
    font-family: Helvetica, sans-serif;
    font-size: 30px;
    margin-left: 10px;
    padding: 0;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="main"&gt;
    &lt;div class="sidebar"&gt;
      &lt;h3&gt; olivia schneider, &lt;/h3&gt;
      &lt;h3&gt; graphic designer &amp; writer &lt;/h3&gt;
      &lt;br&gt;
      &lt;h3&gt; +1 (585) 766 5189 &lt;/h3&gt;
      &lt;h3&gt; olivia.schneider@vcfa.edu &lt;/h3&gt;
      &lt;h3&gt; instagram &lt;/h3&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;!-- &lt;h3&gt; recent projects &lt;/h3&gt;
                      &lt;ul&gt;
                          &lt;li&gt; Hunger Mountain #25&lt;/li&gt;
                      &lt;/ul&gt; --&gt;
    &lt;/div&gt;
    &lt;div class="projects"&gt;
      &lt;div class="movie"&gt; &lt;video width="1200" height="800" src="/Users/oliviaschneider/Documents/code projects/PERSONAL WEBSITE_small victories/resources/American Healthcare_OSchneider_PinUp2020 copy.mp4" controls autoplay muted&gt; &lt;/video&gt;
        &lt;p&gt;2020 — typography, creative direction, video editing&lt;/p&gt;
        &lt;p&gt;American Healthcare&lt;/p&gt;
        &lt;p&gt;A short movie I made after I turned 26, got kicked off my parent's healthcare plan, and waited 5 hours to sign up for my state's healthcare coverage.&lt;/p&gt;
      &lt;/div&gt;
  
      &lt;div class="reader"&gt; &lt;video width="1200" height="800" src="/Users/oliviaschneider/Documents/code projects/PERSONAL WEBSITE_small victories/reader copy.mp4" controls autoplay muted&gt; &lt;/video&gt;
        &lt;p&gt;2020 — web design, front-end development, writing &lt;/p&gt;
        &lt;p&gt;A Web Reader&lt;/p&gt;
        &lt;p&gt;A place for my essays, reflections, and critiques of things. &lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>