Foros del Web » Creando para Internet » CSS »

Problema tonto y chorras de márgenes

Estas en el tema de Problema tonto y chorras de márgenes en el foro de CSS en Foros del Web. Hola! Me estoy volviendo loco. Tengo un div que es el container de todo. Dentro, tengo uno que es el header y un subcontainer. El ...
  #1 (permalink)  
Antiguo 30/12/2008, 18:23
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 15 años, 7 meses
Puntos: 1
Problema tonto y chorras de márgenes

Hola!

Me estoy volviendo loco. Tengo un div que es el container de todo. Dentro, tengo uno que es el header y un subcontainer.

El subcontainer tiene un subcontaineraux (porqué quiero hacerle las esquinas redondeadas al container visible, es decir, a todo el container excluyendo el header), un div para el banner y más cosas.

PROBLEMA: Cuando muevo un poco abajo el banner, para que me deje un espacio entre el header y éste (de manera que el header no estaría pegado al banner sinó que tendría una breve línea separatória), se me mueve tambien el subsubcontainer, así que cuando intento redondear este, no se ve nada.

Os dejo el link y quizá lo veis más claro:

http://tecnotortest.site50.net

Yo lo que quiero es que el subcontaineraux esté enganchado al header, y el banner un poquito más abajo. (13.5px más abajo). Así, el banner no lo tengo enganchado al header y puedo redondear las esquinas del subcontaineraux.

Espero que se haya entendido. Tiene que ser una chorrada pero no veo la luz.

Gracias!
  #2 (permalink)  
Antiguo 30/12/2008, 18:27
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 5 meses
Puntos: 280
Respuesta: Problema tonto y chorras de márgenes

Ahora no se ve tu página, pero puedes ponerle al banner position: relative; y top 13.5px;
__________________
Visita mi nueva web idplus.org
  #3 (permalink)  
Antiguo 30/12/2008, 18:28
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 9 meses
Puntos: 539
Respuesta: Problema tonto y chorras de márgenes

Hay un problema con tu página:
Cita:
Website under Review
Hay varias técnicas para ello, casualmente termino de abrir este tema

Y Mikmoro en Araudi.net tiene algún ejemplo también, creo recordar.

Edito: por un minuto, encontronazo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #4 (permalink)  
Antiguo 30/12/2008, 18:33
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Problema tonto y chorras de márgenes

Vaya hombre, justo me la ponen ahora en revisión... Maldito free hosting xD

Bueno, os comento. Probé el position: relative en el banner (antes de postear) y el problema es que me dejaba el espacio deseado... pero un div que había más abajo (que era un menu horizontal) me subía para arriba. Y entonces claro, no iba bien. No se si es que tengo que añadir algo más en el div del menu para que no se me vaya arriba? Le puse más margin-top pero bajó el menú junto al banner :S:P!

Gracias por la ayuda!

EDITO: Sí, esquinas redondeadas así estarían bien, creo que buscaré algun manual de fireworks a ver... De mientras dejaré lo que tengo, aunque cuando aprenda a hacer una simple redonda miraré de cambiarlo :)
  #5 (permalink)  
Antiguo 30/12/2008, 18:34
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 5 meses
Puntos: 280
Respuesta: Problema tonto y chorras de márgenes

Pero juraría que el problema no es cómo redondear las esqunas, sino como dar un margen superior para una separación a un elemento sin que el elemento padre se desplace con él, algo que sabemos que ocurre en FF habitualmente.
__________________
Visita mi nueva web idplus.org
  #6 (permalink)  
Antiguo 30/12/2008, 18:35
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Problema tonto y chorras de márgenes

Cita:
Iniciado por Mikmoro Ver Mensaje
Pero juraría que el problema no es cómo redondear las esqunas, sino como dar un margen superior para una separación a un elemento sin que el elemento padre se desplace con él, algo que sabemos que ocurre en FF habitualmente.
Exacto, ese es mi problema :S Qué significa FF?
  #7 (permalink)  
Antiguo 30/12/2008, 18:36
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 5 meses
Puntos: 280
Respuesta: Problema tonto y chorras de márgenes

Hemos chocado los tres.

Pues samy4ever, es tan sencillo como dar posición relativa al menú y desplazarlo también a tu gusto.

FF= Firefox
__________________
Visita mi nueva web idplus.org
  #8 (permalink)  
Antiguo 30/12/2008, 18:40
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Problema tonto y chorras de márgenes

Oks, gracias... Voy a instalar apache y probar allí, ya que el hosting se me ha puesto en huelga unas horas xD

Aún me quedo el camino de Santiago para aprender bien CSS :P
  #9 (permalink)  
Antiguo 30/12/2008, 19:04
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Problema tonto y chorras de márgenes

Bueno, he ido probando desde mi ordenador, ahora servidor.

Al final lo que he hecho ha sido poner el banner en posición relativa Y el subcontainer que tenía a este en absoluta.

#subContainerAux{
position: absolute;
width: 996px;
-moz-border-radius: 12px;
background-color:green;
}

#banner{
position: relative;
width: 964px;
height: 220px;
background-color:red;
margin: auto;
margin-top: 13.5px;
-moz-border-radius: 50px; /* Per navegadors motors gecko arrodonim... */
}


Hay dios mio, cuesta más el diseño que la web! jejejej
  #10 (permalink)  
Antiguo 30/12/2008, 19:42
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Problema tonto y chorras de márgenes

Chicos, sigo con problemas.

A ver, he cambiado la estructura de divs (me he dado cuenta que sobraba uno), y al quitarlo me pasa esto...

http://img72.imageshack.us/my.php?image=dibujoyh8.jpg

El banner está en posición relativa. Pero para que no se me enganche a su contenedor (aún y tener margin-top: 13.5px) la ÚNICA forma que he encontrado es ponerle position: absolute; al contenedor del banner. El problema me viene en qué ese contenedor deja de estar en el centro y no logro centrarlo :( En Mozilla/Chrome se me tira para la izquierda, en IE para la derecha...

Código:
body {
	text-align:center;
	color: silver;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #333344;
	background-image: url(./final.png); 
	background-repeat:repeat-x;
}

#container{
	width: 996px;
	height: 562px;
	background-color: black;
	margin: 0 auto;
	-moz-border-radius: 12px; /*Per navegadors motors gecko arrodonim... */
	position: absolute;
	text-align:center;
}

#header{
	width: 996px;
	height: 61px;
	background-color: white;
	margin: 0 auto;
}

#banner{
	position: relative;
	width: 964px;
	height: 220px;
	background-color:red;
	margin: auto;
	margin-top: 13.5px;
	-moz-border-radius: 20px; /* Per navegadors motors gecko arrodonim... */
}
Alguna idea de cómo sacar el absolute para que quede centrado, o de cómo puedo centrarlo teniendo el absolute?:S
  #11 (permalink)  
Antiguo 31/12/2008, 06:12
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Problema tonto y chorras de márgenes

A ver si alguien me puede dar una mano! La web ya funciona:P

http://tecnotortest.site50.net !
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




La zona horaria es GMT -6. Ahora son las 07:45.