Hola, aquí te adjunto un css y el xhtml válido que creo que te servirán:
 
<style type="text/css">
body {background-color: #ffffcd;font-size: 11px;font-family: Verdana, Arial, 
SunSans-Regular, Sans-Serif;color:#564b47;padding:0;margin:0;}
#container {width: 900px;margin-bottom: 10px;margin: 0 auto;background-color: 
#EBD3E0;}
#centro {background-color: #ffffff;padding: 0px;margin: 0px 250px 0px 200px;}
#izquierda {float: left;width: 200px;margin: 0;padding: 0;}
#derecha {float: right;width: 250px;margin: 0;padding: 0;}
#bajo {clear: both;margin: 0;padding: 0;text-align: left; }
</style>
 
 
<div id="container">  <div id="izquierda">Izquierda</div>
 <div id="derecha">Derecha</div> 
 <div id="centro">Centro</div>
 <div id="bajo">Poner aquí el resto de la web, en el caso de que haya</div>
</div>
 
 
 
Saludos
 
> From: [EMAIL PROTECTED]> To: ovillo@lists.ovillo.org> Date: Mon, 31 Mar 2008 
> 17:28:21 +0200> Subject: [Ovillo] Maquetando cabecera con CSS> > > Hola a 
> [EMAIL PROTECTED],> > estoy maquetando la cabecera de mi web con CSS. Tiene 
> tres elementos, que son: una logo, un título y un botón; van los tres 
> colocados, formando una línea horizontal. Ya casi lo tengo, pero no consigo 
> cuadrar la imagen.> > Tengo este CSS:> > /*cabecera*/#L_CabTabla 
> {/*cabecera*/ POSITION:relative; top:1px; left:5px; WIDTH:617px; 
> background-color:#6557D0;}#L_CabLogo {/*img.*/ left:5px; width:55px; 
> background-color:#5215B4; border-right:3px solid #ffffff;}#L_CabTitulo 
> {/*titulo general*/ POSITION:absolute; text-align:left; top:1px; left:68px; 
> padding-left:4px; padding-right:4px;}/*boton salir SSPP*/#L_SALIR { 
> POSITION:absolute; z-index:1; top:1px; left:505px; width:50px; color:white; 
> cursor:pointer; BACKGROUND-COLOR:transparent; TEXT-ALIGN:center; 
> font-weight:bold; BORDER-style:solid; BORDER-width:2px}> > y este HTML 
> asociado:> > <center>> <div id="L_CabTabla" align="center">> <div 
> id="L_CabLogo">> <img name="logo" alt="SV" title="SV" src="logo.gif" 
> border="0">> </div>> > > <div class="cabTitulo" id="L_CabTitulo">> 
> Bienvenidos a<br/>Portal SV> </div>> > > <div style="top: 18px;" 
> id="L_SALIR">> <a style="color: white;" 
> onmouseover="javascript:document.getElementById('textosalir').style.color='red'"
>  onmouseout="document.getElementById('textosalir').style.color='white'" 
> href="javascript:salir();">> <span id="textosalir">Salir</span>> </a>> 
> </div>> </div>> </center>> > Con esto, consigo obtener un bloque centrado, 
> donde aparecen el título (centrado), el botón de Salir (a la derecha del 
> texto) y la imagen, que sale también centrada, superpuesta bajo el texto. Lo 
> que yo quiero es que salga a la izquierda de éste. Lo intenté poniéndole a su 
> capa float:left, y aunque IE lo coge en FF no sale bien.> > Muchas gracias 
> desde ya!> > Saludos =)> > 
> _________________________________________________________________> 
> Tecnología, moda, motor, viajes,…suscríbete a nuestros boletines para estar 
> siempre a la última> Guapos y guapas, clips musicales y estrenos de cine. > 
> _______________________________________________> Lista de distribución 
> Ovillo> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org> 
> Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
> http://lists.ovillo.org/mailman/listinfo/ovillo
_________________________________________________________________
La vida de los famosos al desnudo en MSN Entretenimiento
http://entretenimiento.es.msn.com/
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo

Responder a