Fluid layout with fixed header !

<!-- main outer wrapper -->
<div id="wrapper">
 
 
   <!-- want this fixed about 10-15% of height -->
   <div id="header">
 
      <!-- fixed height  buttons inline -->
      <div id="buttons> 
	 <a onclick='..'><img src='xyx.jpg'></a>
	 <a onclick='..'><img src='xyx.jpg'></a>
	 <a onclick='..'><img src='xyx.jpg'></a>
      </div>
      <!-- fixed height always below buttons inline -->
      <div id="menu"> <!-- items inline..-->
         <a onclick='...'>MENUITEM1</a>
         <a onclick='...'>MENUITEM1</a>
         <a onclick='...'>MENUITEM1</a>
      </div>
 
   </div>
 
 
   <!-- want this fixed always below header -->
   <div id="content">
 
     <!-- table should be scrollable BUT header fixed -->
     <table id="table1">
      <thead>
	<tr>
	  <th>H1</th>
	  <th>H2</th>
	  <th>H3</th>
	  <th>H4</th>
	</tr>
      </thead>
 
      <tbody>
	<tr><td> etc.etc
 
      </tbody>
 
     </table>
 
 
   </div>
 
 
 
</div>