Re: algo hago mal con las CSS
Von: Jose (mi.mail@no.es) [Profil]
Datum: 24.09.2006 12:12
Message-ID: <ASsRg.26593$6D6.3474@news.ono.com>
Newsgroup: es.comp.infosistemas.www.paginas-web
Datum: 24.09.2006 12:12
Message-ID: <ASsRg.26593$6D6.3474@news.ono.com>
Newsgroup: es.comp.infosistemas.www.paginas-web
Prueba con esto si lo que quieres es un marco que bordee tu cabecera:
<style type="text/css">
#cabecera
{
position: relative;
}
#cabecera #marco
{
position: absolute;
width: 100%;
border: 1px solid black;
}
#cabecera #logo
{
float: left;
}
#cabecera #banner
{
float: right;
}
</style>
</head>
<body>
<p>Fecha o algo parecido</p>
<div id="cabecera">
<div id="marco">
<a href="#"><img id="logo" src="logo.jpg"
width="50px"
height="60px" alt="logo"/></a>
<a href="#"><img id="banner" src="logo.jpg"
width="468px" height="60px" alt="banner"/></a>
</div>
</div>
</body>
Lo de poner una capa MARCO dentro de la cabecera está hecho porque si
pones 100% de anchura en la cabecera y un marco a ese estilo, que serÃa
lo suyo, Firefox y Opera (bajo Windows) hacen que la capa se salga
ligeramente por la parte derecha del navegador lo que provoca que
aparezca la barra de scroll inferior - horizontal - (con Explorer esto
no pasa). Si te fijas MARCO tiene la posición absoluta; esto hace que al
tener elementos dentro de tipo absoluto también pues esta capa crezca
hacia abajo (o al menos eso parece, ¿no? - prueba y verás -).
Poniendo
una capa MARCO dentro de la capa CABECERA lo que conseguimos es que la
cabecera, al no tener el 100% de la anchura, se ajuste al tamaño del
navegador adecuadamente y, dentro de esta, la otra que tenemos la 100%
llene como mucho el espacio de cabecera sin "salirse del navegador".
¿Por qué tanto cuento con el 100% si no se
necesitarÃa ponerlo al ser el
DIV un elemento de bloque que ya ocupa el 100% de la anchura?... pues no
sé, pregúntaselo al Opera que cuando quitas ese 100% hace que
las capas
logo y banner queden pegadas en la parte izquierda de la cabecera
(prueba quitando la palabra #marco del estilo #cabecera marco para que
te use esas reglas en el estilo marco y verás que sorpresa.
En fin, espero que esto te sirva.
Un cordial saludo [...]
--
PD: Yo no me obsesionarÃa tanto con lo del W3C y la validación.
Por
cierto, si quieres un ejemplo de página que valida puedes ver
http://www.p-folio.net/ -1024x768 - que está hecha a base de PHP, MySQL
y capas tipo cabecera, pie, contenidos, etc, etc... - mi cutre página
personal que la comencé y la dejé ahà muerta de la
risa... XHTML
1.1Strict, probada en Explorer, Firefox y Opera (todos bajo Windows)... - ).
-----
Victor Lopez escribió:
> Jose tal como el Sábado 23 Septiembre 2006 20:30 dijo:
>
>> Prueba poniendo asà tu hoja de estilos: [...]
>>
> Perfectamente, porque es lo que me ocurre ... pero no se si deberÃa ser
asÃ
> como lo hace ... mas bien como 'se supone' que denerÃa hacerlo (pero no
> somos del W3C) ... :-(
[ Auf dieses Posting antworten ]