title: responsiv css, element flows in to each other
body: <p>i'm trying to build a responsiv webpage and it works on small screen up to 640px and on bigger screens. there are two elements next to each other. 
  The problem is between the breakpoint 640 px and up to bigger screens. Until you've stretched out to bigger screen the two elements floats in to each other. Like between maybe 640 px and up to 800 px.. </p>
  
  <p>Here's the css where the two elemets is placed next to each other.</p>
  
  <pre><code>@media screen and (min-width: 640px) {
  
  article {
      max-width: 75%;
      position: absolute;
      margin-right: 2em;
  }
  
  aside {
      float: right;
      display: inline;
      max-width: 20%;     
  }
  </code></pre>
  
  <p>How can i get them to not float in to each other?</p>