Foros del Web » Creando para Internet » CSS »

Meter un DIV dentro de otro DIV

Estas en el tema de Meter un DIV dentro de otro DIV en el foro de CSS en Foros del Web. Hola. Tengo este código CSS que lo que hace es que crea una tabla grande (#header_menu) y dentro creo 4 tablas pequeñas. El caso es ...
  #1 (permalink)  
Antiguo 15/09/2010, 15:00
 
Fecha de Ingreso: abril-2004
Mensajes: 107
Antigüedad: 13 años, 7 meses
Puntos: 0
Pregunta Meter un DIV dentro de otro DIV

Hola.

Tengo este código CSS que lo que hace es que crea una tabla grande (#header_menu) y dentro creo 4 tablas pequeñas. El caso es que cuando hago que la tabla grande, la de color rojo en la foto, tenga una altura menor, reduzco el height, las que están dentro no se "van" con ella, sino que se quedan donde están. Con este dibujo lo vais a ver mejor:




Código:
#header_menu {
    width: 700px;
    height: 50px;
    float:right;
    margin-top: 0px;
    font-size:25px;
    background:#ff0000;}
    
#header_menu a:link {text-decoration:none;}
#header_menu a:visited {text-decoration:none;}
#header_menu a:hover {color: #FFF;}
#header_menu a:active {text-decoration:none;}

    
#header_menu_inicio {
    width: 100px;
    height: 50px;
    position:absolute;
    margin-top: 50px;
    padding: 20px 0px 0px 50px;
    background: url('../img/icono-inicio.png') no-repeat;
    }
    
    
#header_menu_contacto {
    width: 100px;
    height: 50px;
    position:absolute;
    margin-top: 60px;
    margin-left: 135px;
    padding: 10px 0px 0px 55px;
    background: url('../img/icono-contacto.png') no-repeat;
    }
    
#header_menu_cuenta {
    width: 150px;
    height: 50px;
    position:absolute;
    margin-top: 50px;
    margin-left: 315px;
    padding: 20px 0px 0px 52px;
    background: url('../img/icono-cuenta.png') no-repeat;
    }
    
#header_menu_carrito {
    width: 150px;
    height: 50px;
    position:absolute;
    margin-top: 50px;
    margin-left: 500px;
    padding: 20px 0px 0px 52px;
    background: url('../img/icono-carrito.png') no-repeat;
    }


El código de la página es


Código:
<div id="header_menu">
					<div id="header_menu_inicio">
					<a href="index.php">Inicio</a>
					</div>
					<div id="header_menu_contacto">
					<a href="contact-form.php">Contacto</a>
					</div>
					<div id="header_menu_cuenta">
					<a href="my-account.php">Mi cuenta</a>
					</div>
					<div id="header_menu_carrito">
					<a href="order.php">Carrito</a>
					</div>
				</div>
¿Por qué si encojo la tabla roja no se mueven los demás elementos hacia arriba con ella?

Última edición por varuk; 15/09/2010 a las 15:05 Razón: Corregir un error.
  #2 (permalink)  
Antiguo 15/09/2010, 16:21
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Meter un DIV dentro de otro DIV

Todos comienzan en el mismo lugar, por lo que la altura no influye. Eso sería el margin-top de la mayor y de cada una. Suerte
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #3 (permalink)  
Antiguo 15/09/2010, 17:20
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Meter un DIV dentro de otro DIV

Hola:

Sin la URL de tu página o en su defecto el código completo, me inclino a pensar que el problema es que todos los header_menu_xxx estan en position:absolute, entonces puede estar tomando la posición desde el borde del navegador.

Pero, como dice Kseso?, con esta información son sólo cábalas.

Saludos.

  #4 (permalink)  
Antiguo 16/09/2010, 17:57
 
Fecha de Ingreso: noviembre-2008
Mensajes: 94
Antigüedad: 9 años
Puntos: 6
Respuesta: Meter un DIV dentro de otro DIV

agrégale un position:relative a #header_menu y quítale el float: right.

Los elementos con posición absoluta agarran su posición a partir del último elemento dentro de sus padres declarado como relativo. Si no encuentran ninguno agarran su posición del body, y creo que eso es lo que está pasando aquí.
  #5 (permalink)  
Antiguo 17/09/2010, 06:43
 
Fecha de Ingreso: abril-2004
Mensajes: 107
Antigüedad: 13 años, 7 meses
Puntos: 0
Respuesta: Meter un DIV dentro de otro DIV

Muchas gracias a todos por contestar, aunque no se ha arreglado.

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 10:37.