Research on creating grids that combine percentage and static (e.g. pixel) values in CSS

Question

I just want to make a research that concerns responsive web design. Don\'t treat this question like a problem that must be solved. It\'s just an experiment :)

Sometim

Answer 1

(Edit: this one is similar (/simplified) to the OP's Solution 1 and AFAIK he covered all of the most popular solutions out in the wild. To recap, this one is a neat way to make it cross-browser compatible)

jsBin demo

...would be to simply mimic the way table does it,
and prevent stretches using table-layout: fixed;:

article, aside {
  display:table-cell;
}
aside {
  width: 50px;  
}
section {
  display:table;
  table-layout: fixed;
  width:100%;
}

See also: Two column template with static and responsive width

NOTE! Don't forget you can nest elements inside the two-column version or other versions to create different variants.