How to places two divs in one row: one fixed, other is stretched

Question

I need two div boxes: one at left side with fixed width, and other on the right side of first and it should stretch to right side. How to do this?

/-- 30px --//------ * -------/
|          |                 |
|          |                 |

Answer 1

Here are a load of CSS-layouts, that page should give you the answer:

http://tjkdesign.com/articles/one_html_markup_many_css_layouts.asp

Answer 2

<div style="left:0;width:30px;"></div>
<div style="left:30px;right:0;"></div>

You may need to make them absolute positioned and the parent relative.

Answer 3

Better not to use absolute position, since you may want to place it within other elements. That's what works for me:

<div>
  <div style="float: left; width: 30px">1</div>
  <div>2</div>
</div>