Problème avec l'en-tête du site en CSS

Question

Je suis actuellement en train de reconstruire un site web qui utilise une disposition de table et que je veux faire avec des couches et css.

Le problème que j'ai est avec l'en-tête. L'en-tête est actuellement une table à 100% de largeur avec 3 cellules.

[cadre gauche] [logo 800px] [rightframe]

<table border="0" width="100%" height="600" cellpadding="0" cellspacing="0"> 
    <tr> 
    <td background="images/background_left.jpg">&nbsp;</td> 
    <td width="800" valign="top">the header content</td> 
    <td background="images/background_right.jpg">&nbsp;</td> 
    </tr> 
</table> 

La cellule centrale, la bannière de logo, est devrait toujours être 800px. Les cellules gauche et droite ont un arrière-plan qui correspond aux extrémités du logobanner.

Maintenant, la question serait de savoir comment je peux résoudre ce problème avec css?

Merci

Answer 1

Essayez cette Html:

<div id="header"> 
    <div id="left"> 
     <div id="leftFrame"></div> 
     <div id="center"></div> 
    </div> 
    <div id="right"></div> 
</div> 

CSS:

#header{ 
width:100%; 
height:600px; 
} 
#left{ 
width:66%; 
float:left; 
} 
#right{ 
float:right; 
} 
#center{ 
width:800px; 
float:right; 
} 
#leftFrame{ 
float:left; 
} 

Non testé, mais espérons que cette aide