Lo que quiero hacer parece sencillo pero ahora mismo no logro dar con la solución y tal vez no sea tan sencillo o yo me lo estoy planteando mal.
Básicamente lo que quiero es que dentro de una capa contenedora meter 3 capas, una que iría al centro y con un ancho fijo (en esa va a ir una imagen estática), una capa a la izquierda y la otra a la derecha con ancho variable y una imagen de fondo que se repite que será la continuación de la que esta centrada. El ancho de las capas laterales deben ocupar todo el espacio libre por ambos lados.
Lo único que he conseguido es que las tres capas estén en la misma linea, ocupando su posición y centrar la capa central, pero no se como darle el ancho adecuado a las capas laterales. ¿se puede hacer? ¿hay otras alternativas?
Resumo el código para que se vea mejor.
Código HTML:
<div id="cabcontenedor">
<div id="cabeceraizq"> </div>
<div id="cabeceracen">
<img src="logo.jpg" />
</div>
<div id="cabeceradrc"> </div>
</div>
CSS
Código:
div#cabcontenedor{
width:100%;
}
div#cabeceraizq{
height:143px;
float:left;
}
div#cabeceracen{
width:780px;
height:143px;
position:absolute;
left:50%;
margin-left:-390px;//con esto centro el div
}
div.cabeceradrc{
height:143px;
float:right;
}
Gracias ;)