title: Two column layout, fixed right column
body: <p>I am stuck with a seemly simple two column CSS layout. Typically this layout is simple but I am building a responsive site and need the columns to collapse in the correct order for mobile, on top of each other.</p>
  
  <p>On desktop, I need the right column to be fixed size, say 200px and the rest of the area to be taken up by the left column. Naturally I need the columns to clear and push content below down.</p>
  
  <p>On mobile, they would just stack. So the left column is above the right column.</p>
  
  <p>As mentioned before, this type of layout is usually accomplished simply by floating one of the columns and/or setting large margins, but this approach requires the left and right to be swapped in the document flow and would make the collapsed mobile version impossible.</p>
  
  <p>I have even looked at display table and table-cell, this works relatively well for the most part, but unfortunately FireFox does not support absolute positioned elements within the layout breaking some of the content within.</p>
  
  <p>I'm a seasoned developer, surly accomplishing this should be simpler that I am finding?</p>