Вопрос по CSS

HTML:
<div id="page_header">
...
</div>
<div id="page_content">
...
</div>

Как сделать с помощью CSS так, чтобы блок page_header принял минимальную возможную
для него ширину и расположился в левом верхнем углу, а блок page_content по ширине занял
всё остальное место в окне браузера. При этом они должны распологаться один за другим, но
без обтекания, т.е.
+--------+-----------------------------------+
| page_  |                                   |
| header |    PAGE_CONTENT                   |
|        |                                   |
+--------+                                   |
         |                                   |
         |                                   |
         |                                   |
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Если бы у блока page_header была фиксированная ширина, то можно сделать например так:
div#page_header {
  float: left;
  width: 10%;
}
div#page_header {
  float: left;
  width: 90%;
}

А можно ли сделать не фиксированные 10% а автоматически вычисляемую ширину?
У меня никак не получается :-(
Конечно это несложно сделать таблицей, но хочется использовать CSS.