Edit on
<div class="kapsayici">
  <aside>
    <ul>
      <li><a href="">Sol menü 1</a></li>
      <li><a href="">Sol menü 2</a></li>
      <li><a href="">Sol menü 3</a></li>
      <li><a href="">Sol menü 4</a></li>
      <li><a href="">Sol menü 5</a></li>
    </ul>
  </aside>
  <main>
    <p>Contrary to popular belief</p>
    <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked
      up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.</p>

    <p>Ea commodo consequat</p>

    <p>Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line
      of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32.</p>

    <p>Ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.</p>

    <p>Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC.</p>

    <p>Ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.</p>
  </main>
</div>
@import "nib"

.kapsayici
  width 984px
  margin 0 auto
  background-image linear-gradient(bottom right, #ccc 284px, #ccc 284px, #fff 100%)
  clearfix()
  
  aside
    float left
    width 284px
    
  main
    float left
    width 700px
View Compiled
Rerun