Si lo que tienes es un h1 a la izquierda y una capa con todo lo demas a la
derecha
¿Por que no flotas esa capa a la derecha y lo que esta dentro tabien a la
derecha?
Si quieres que en el bloque derecho te quede el ul debajo de el logo y
texto, escribelo en ese orden, el ul lo ultimo. Suponiendo que todo este
flotando a la derecha.
Ah! calcula el ancho total del div contenedor, decide un ancho para el h1 y
el resto para la capa que flota a la derecha y que contiene al logo, el
texto y el ul (#cabecera)
Espero te sirva y se entienda
2009/10/5 Nacho F. Carreño na...@stvisual.com
Hola,
Me está dando unos problemas la cabecera de una Web y no soy capaz de
dar con la solución. La estrucutra que tengo es la siguiente. Tengo una
capa contenedor donde aplico el ancho de la Web y la centro. A
continuación tengo un encabezado h1 con un texto, después una capa
id=cabecera y dentro de esta capa tengo una imagen con el logo de la
empresa enlazada a la página de inicio flotada a la derecha y un texto
que también está flotado a la derecha. El caso es que dentro de esta
misma capa tengo una lista ul con diferentes funcionalidades que quiero
colocar en la parte derecha de la Web, para ello le he puesto al ul
position:absolute; y me funciona en todos los navegadores menos en IE6.
Sin embargo si lo primero que pongo es la lista ul con las
funcionalidades justo antes del h1 se ve correctamente es como si se
ocultara por detrás de la capa cabecera o contenidor, he probado con el
z-index pero nada ¿sabéis que es lo que puede estar pasando? Os pego el
código para que os hagáis una idea mejor:
HTML:
div id=contenedor
h1 id=h1cabeceraTítulo de la Web/h1
div id=cabecera
a href=index.php title=Ir a la página de inicioimg
src=imagenes/logo.gif alt=Logotipo class=logo //a
p class=ocultoa href=#contcentral title=saltar
menuacute; accesskey=iSaltar menuacute;/a/p
div id=txtcabpBienvenido a mi página Web/p/div
ul id=funcionalidades
li id=finicioa href=index.php title=Ir a la
paacute;gina de inicio accesskey=iInicio/a/li
li id=fcontactaa href=contacta.php title=Ir a la
paacute;gina de contacto accesskey=cContacta/a/li
li id=fmapaweba href=mapaweb.php title=Ir a la
página Mapa Web accesskey=mMapa Web/a/li
li id=frecomendara href=recomendar-amigo.php?id=?
echo $id; ?amp;url=? echo $urlamig; ? title=Recomendar a un amigo
accesskey=rRecomendar a un amigo/a/li
/ul
/div
CSS:
#contenedor {
width:60em; margin:auto; text-align:left;
}
h1#h1cabecera {
color:#FFF; font-size:0.63em; line-height:1.80em; text-align:center;
font-weight:normal; margin:0;
}
#cabecera {
text-align:left; position:relative;
}
img.logo {
display:block; float:left; margin:17px 0 0 20px; border:0;
}
div#txtcab {
float:left; margin:29px 0 0 57px; width:30em;
}
#txtcab p {
font-size:0.63em; color:#902444; margin:0;
}
ul#funcionalidades {
margin:0; padding:0; border:0; list-style-type:none;
position:absolute; top:73px; right:40px; z-index:500;
}
#funcionalidades li {
display:block; float:left; width:1.56em; height:1.38em;
background-color:#E5CCD3; text-indent:-9em; margin:0 3px 0 0;
}
#funcionalidades li a:link, #funcionalidades li a:visited,
#funcionalidades li a:hover {
display:block; float:left; width:1.56em; height:1.38em;
}
Un saludo,
Nacho
___
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
--
Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
-
Caminar sobre el agua y desarrollar software a partir de unas
especificaciones es fácil. si ambas están congeladas.
Edward V. Berard, ingeniero informático.
___
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