Edit in JSFiddle

.wrap {
  margin: 20px;
}

section {
  background: Pink;
  padding: 20px;
  position: relative;
  overflow: hidden;
}

.article-wrap {
  margin: 0 193px 0 0;
}

article {
  float: left;
  width: 33%;
}

.inner-article {
  background: LightGoldenRodYellow;
  margin: 0 20px 0 0;
  padding: 10px;
}

aside {
  background: Aquamarine;
  float: right;
  /*Needs to be floated to have height, not absolutely positioned*/
  margin-bottom: -5000px;
  /*100% column height trick*/
  padding-bottom: 5000px;
  /*100% column height trick*/
  margin-left: -200px;
  /*Keep the sidebar in it's palce when floated*/
  width: 200px;
}

.inner-sidebar {
  padding: 15px;
}

/*Just to make it pretty*/
.wrap {
  font: normal 13px/1.4 sans-serif;
}

header {
  margin: 0 0 20px 0;
  width: 100%;
}

h1 {
  font: bold 25px/1.4 sans-serif;
}

h2 {
  font: bold 18px/1.4 sans-serif;
}

p {
  margin: 10px;
}

ul {
  list-style: disc;
  margin: 0 0 0 17px;
}

.cf:before,
.cf:after {
  content: "";
  display: table;
}

.cf:after {
  clear: both;
}

.cf {
  zoom: 1;
}
<div class="wrap">
  <header>
    <h1>
      Fixed width and 100% height sidebar, px margins, all fluid
    </h1>
  </header>
  <section>
    <div class="article-wrap">
      <article>
        <div class="inner-article">
          <p>The sidebar stays fixed width, the margins stay fixed width and it's still fluid. Boom!
          </p>
          <p>Cras mattis consectetur purus sit amet fermentum. Maecenas sed diam eget risus varius blandit sit amet non magna. Nulla vitae elit libero, a pharetra augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
          </p>
          <p>
            Donec sed odio dui. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
          </p>
        </div>
      </article>
      <article>
        <div class="inner-article">
          <p>
            Cras mattis consectetur purus sit amet fermentum. Maecenas sed diam eget risus varius blandit sit amet non magna. Nulla vitae elit libero, a pharetra augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
          </p>
          <p>
            Donec sed odio dui. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit.
          </p>
        </div>
      </article>
      <article class="last">
        <div class="inner-article">
          <p>
            Cras mattis consectetur purus sit amet fermentum. Maecenas sed diam eget risus varius blandit sit amet non magna. Nulla vitae elit libero, a pharetra augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
          </p>
          <p>
            Donec sed odio dui. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit.
          </p>
        </div>
      </article>
    </div>
    <aside class="cf">
      <div class="inner-sidebar">
        <h2>Sidebar</h2>
        <ul>
          <li>
            The sidebar
          </li>
          <li>
            is not
          </li>
          <li>
            positioned absolutely
          </li>
          <li>
            so it has a height
          </li>
          <li>
            and is pushing
          </li>
          <li>
            the section
          </li>
          <li>
            as the content increses
          </li>
          <li>
            in it.
          </li>
          <li>
            List item number one
          </li>
          <li>
            List item number two
          </li>
          <li>
            List item number three
          </li>
          <li>
            List item number four
          </li>
          <li>
            List item number five
          </li>
          <li>
            List item number eight
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            And so on
          </li>
          <li>
            Last list item
          </li>
        </ul>
      </div>
    </aside>
  </section>
</div>