Foros del Web » Creando para Internet » CSS »

Problema con divs y css

Estas en el tema de Problema con divs y css en el foro de CSS en Foros del Web. Hola, pretendo que un div menu (que esta dentro de un contenido) se centre dentro del div contenido y tenga una separacion superior, un margin-top. ...
  #1 (permalink)  
Antiguo 24/03/2011, 14:37
 
Fecha de Ingreso: febrero-2010
Mensajes: 96
Antigüedad: 7 años, 10 meses
Puntos: 1
Exclamación Problema con divs y css

Hola, pretendo que un div menu (que esta dentro de un contenido) se centre dentro del div contenido y tenga una separacion superior, un margin-top. Resulta que la separacion tiene efecto, si le aplico un borde al div contenido, si le quito el borde, el div menu se pega el div contenido. No se que ocurre, os pego el codigo y espero me podrais ayudar.

index.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&iacute;tulo</title>
<link href="css/estilo.css" rel="stylesheet" type="text/css" media="screen" />
</head>

<body>
<div id="contenido">
<div id="menu"></div>

</div>
</body>
</html>

estilo.css:

#contenido {
background-color:#99CC66;
width:800px;
height:435px;
border:1px solid;
}


#menu{
width:750px;
height:25px;
margin:1% auto;
background-color:#000000;
}
  #2 (permalink)  
Antiguo 24/03/2011, 14:52
 
Fecha de Ingreso: marzo-2011
Mensajes: 20
Antigüedad: 6 años, 8 meses
Puntos: 0
Respuesta: Problema con divs y css

osea quieres ponerle border al menu o al Contenido... por que no entendi muy bien...

Pero creo que tu problema radica en que estas usando "%" en ves que un espacio calculado...

ejemplo:

Código:
#contenido {
background: #99CC66;
width:800px;
height:435px;
border: solid 1px #ccc;
}


#menu{
width:750px;
height:25px;
margin-top: 10px;
background: #000;
}
  #3 (permalink)  
Antiguo 24/03/2011, 15:04
 
Fecha de Ingreso: febrero-2010
Mensajes: 96
Antigüedad: 7 años, 10 meses
Puntos: 1
Respuesta: Problema con divs y css

Yo no quiero poner borde a nada, quiero que el div menu se centre dentro del menu contenido y se separe de la parte superior unos pixeles (margen). Si pongo borde al contenido se separa de la parte superior, si lo quito, se pegan los divs.

El margin:1% auto; el 1% he probado con pixeles y nada y el auto es para que se centre en el div contenido.
  #4 (permalink)  
Antiguo 24/03/2011, 15:10
 
Fecha de Ingreso: marzo-2011
Mensajes: 20
Antigüedad: 6 años, 8 meses
Puntos: 0
Respuesta: Problema con divs y css

OK entendido, esto te ayudara:

#contenido {
position: relative;
background: #99CC66;
width:800px;
height:435px;
border: solid 1px #ccc;
}


#menu{
position: relative;
width:750px;
height:25px;
margin: 10px auto;
background: #000;
}
  #5 (permalink)  
Antiguo 24/03/2011, 15:25
 
Fecha de Ingreso: febrero-2010
Mensajes: 96
Antigüedad: 7 años, 10 meses
Puntos: 1
Respuesta: Problema con divs y css

Si quito el border del primer div, no me funciona... Es decir, me funciona con el border, lo puedo dejar y ponerlo de color blanco, pero es un poco raro no?
  #6 (permalink)  
Antiguo 24/03/2011, 15:32
 
Fecha de Ingreso: marzo-2011
Mensajes: 20
Antigüedad: 6 años, 8 meses
Puntos: 0
Respuesta: Problema con divs y css

Probaste el codigo que te puse?, el border no tiene que ver nada con los margenes que le pongas....
  #7 (permalink)  
Antiguo 24/03/2011, 15:34
 
Fecha de Ingreso: febrero-2010
Mensajes: 96
Antigüedad: 7 años, 10 meses
Puntos: 1
Respuesta: Problema con divs y css

Cita:
Iniciado por ArielGomeX Ver Mensaje
Probaste el codigo que te puse?, el border no tiene que ver nada con los margenes que le pongas....
Si, lo he probado, si puedes pruebalo tu, o es el chrome que me hace esto que te estoy diciendo o no se que pasa...pero yo quito el borde y se me desplazan esos pixeles que le doy al margen los dos divs a la vez; pongo el borde y solo se desplaza el div menu. He probado y el explorer hace lo mismo.
  #8 (permalink)  
Antiguo 24/03/2011, 15:52
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.827
Antigüedad: 9 años, 9 meses
Puntos: 953
Respuesta: Problema con divs y css

Cita:
Iniciado por xorcisa Ver Mensaje
Yo no quiero poner borde a nada, quiero que el div menu se centre dentro del menu contenido y se separe de la parte superior unos pixeles (margen). Si pongo borde al contenido se separa de la parte superior, si lo quito, se pegan los divs.

El margin:1% auto; el 1% he probado con pixeles y nada y el auto es para que se centre en el div contenido.
el 1% puede llegar a ser un tamaño bastante pequeño como para ser apreciado, coloque un margen considerable para poder notar la diferencia, muy posible su problema mas que de margenes es un problema visual...

Ahora bien hay otros elementos tanto CSS como html que podrían estar interviniendo por lo que el código que nos ha mostrado resulta insuficiente... muéstrenos el código completo suficiente para poder recrear el problema o aun mejor déjenos un link a su sitio para poder apreciar mas claramente su problema.
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #9 (permalink)  
Antiguo 24/03/2011, 15:56
 
Fecha de Ingreso: marzo-2011
Mensajes: 20
Antigüedad: 6 años, 8 meses
Puntos: 0
Respuesta: Problema con divs y css

pues debe ser el doc-type, ponle el border del mismo color del Background y bajale la cantidad de pixeles que le agregaste al width y al height del DIV.
  #10 (permalink)  
Antiguo 24/03/2011, 16:17
 
Fecha de Ingreso: febrero-2010
Mensajes: 96
Antigüedad: 7 años, 10 meses
Puntos: 1
Respuesta: Problema con divs y css

Cita:
Iniciado por Ag666 Ver Mensaje
el 1% puede llegar a ser un tamaño bastante pequeño como para ser apreciado, coloque un margen considerable para poder notar la diferencia, muy posible su problema mas que de margenes es un problema visual...

Ahora bien hay otros elementos tanto CSS como html que podrían estar interviniendo por lo que el código que nos ha mostrado resulta insuficiente... muéstrenos el código completo suficiente para poder recrear el problema o aun mejor déjenos un link a su sitio para poder apreciar mas claramente su problema.
He probado con ese codigo nada mas, y me falla, me hace lo que os he explicado. Pense que sería el resto de la pagina por lo que probe con dos divs y el html que he pegado...de ahi que no entiendo que ocurre con los divs cuando le pongo borde o no al contenido...no me lo explico.
  #11 (permalink)  
Antiguo 24/03/2011, 16:18
 
Fecha de Ingreso: febrero-2010
Mensajes: 96
Antigüedad: 7 años, 10 meses
Puntos: 1
Respuesta: Problema con divs y css

Cita:
Iniciado por ArielGomeX Ver Mensaje
pues debe ser el doc-type, ponle el border del mismo color del Background y bajale la cantidad de pixeles que le agregaste al width y al height del DIV.
Para que he de hacer esto?
  #12 (permalink)  
Antiguo 24/03/2011, 16:40
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.827
Antigüedad: 9 años, 9 meses
Puntos: 953
Respuesta: Problema con divs y css

el doctype no tiene nada que ver, aunque ciertamente nunca me había percatado de este fallo, lo que puedes hacer es incluir el borde en el elemento padre del mismo color que el background y restarle dos pixeles en ancho y alto.... o en lugar del borde puedes usar overflow:hidden;
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #13 (permalink)  
Antiguo 24/03/2011, 16:50
 
Fecha de Ingreso: febrero-2010
Mensajes: 96
Antigüedad: 7 años, 10 meses
Puntos: 1
Respuesta: Problema con divs y css

Cita:
Iniciado por Ag666 Ver Mensaje
el doctype no tiene nada que ver, aunque ciertamente nunca me había percatado de este fallo, lo que puedes hacer es incluir el borde en el elemento padre del mismo color que el background y restarle dos pixeles en ancho y alto.... o en lugar del borde puedes usar overflow:hidden;
Es lo que he hecho. Pero soy la primera q descubre esto, jay solucion o que pasa? ajajaj me tiene intrigada!
  #14 (permalink)  
Antiguo 24/03/2011, 17:53
 
Fecha de Ingreso: marzo-2011
Mensajes: 20
Antigüedad: 6 años, 8 meses
Puntos: 0
Respuesta: Problema con divs y css

Cita:
Iniciado por Ag666 Ver Mensaje
el doctype no tiene nada que ver, aunque ciertamente nunca me había percatado de este fallo, lo que puedes hacer es incluir el borde en el elemento padre del mismo color que el background y restarle dos pixeles en ancho y alto.... o en lugar del borde puedes usar overflow:hidden;
Se nota que no sabes para que silbe el doctype.
  #15 (permalink)  
Antiguo 24/03/2011, 18:07
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.827
Antigüedad: 9 años, 9 meses
Puntos: 953
Respuesta: Problema con divs y css

Cita:
Iniciado por ArielGomeX Ver Mensaje
Se nota que no sabes para que silbe ?¿ el doctype.
haber señor, el doctype es unicamente para indicarle a los exploradores de que forma debe interpretar el código, de esa forma conseguimos que se vea los mas parecido posible en todos o casi todos los navegadores... de no especificar un doctype el navegador trabajaría en modo quirs y aria lo que se le venga en gana..... dicho eso, creo que no tiene relación con el problema de la compañera.

si cree que estoy equivocado y/o no se para que sirve un doctype, en lugar de usar ese tipo de comentario, haga el favor iluminarme con su sabiduría y hágame ver mi error... y créame que si me da una buena explicación y me hace caer en cuenta de mi error, hasta le daré las gracias por enseñarme algo nuevo.

-----------------------------------------

por otro lado compañera xorcisa no se si sea la primera en ver este error pero si es la primera ves que yo lo veo, sera que casi siempre al div padre aplico el overflow:hidden para que tome el alto de los elementos hijo que tengan algún float: ó tiendo mas a utilizar un padding en el elemento padre para marcar ese tipo de separación.
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....

Última edición por ArturoGallegos; 24/03/2011 a las 18:15

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




La zona horaria es GMT -6. Ahora son las 03:39.