Two columns, left with fixed width, right with dynamic width

Viewed 7954

i am trying to implement a content where i need to have a section of 100% of the browser width and inside it i need to have in the left size a div with 200px width and in it's right i need to have a div with dynamic width depending of the browser width. Example .. browser = 900px -> left div 200px right div 700px. And both of the divs have dynamic height depending how much info i put in them .. the wrapper div will take the biggest of those 2 div height..

So far i did something like this html

<section id="wrapper">
  <div id="list">
  </div>
  <div id="grid">
  </div>
</section>

css

#wrapper {
    width: 100%;
    min-width: 1000px;
    margin: 0 auto;
    padding: 40px 0;
    overflow: hidden;
}

Now i need to css the #list and #grid divs. I hope there is an efficient solution to this because later on i will have the same stuff to do inside the #grid div :)

Thank you in advance, Daniel!

2 Answers
Related