Problemas con espacio entre dos <div> en IE 6

xdunkelheitx · #1 (**permalink**) 11/01/2009, 14:24

Hola soy nuevo en este foro y en el mundo del diseño, haciendo una pagina me tome con un error que me sale en IE6 .

Tengo dos <div> principales una debajo de otra

en la primera tengo textos y un scroll el la cuestion es que en IE 6 reconoce el scroll pero tambien deja el espacio como si no ubiera un scroll por ende cuando pongo la otra <div> abajo esta un poco mas bajo de lo que yo quiero y solo pasa con IE 6 porque con firefox 3 me funciona normal. espero que me puedan ayudar como solucionar este problema si no fui claro diganmelo para explicarlo mejor

Calizman · #2 (**permalink**) 11/01/2009, 14:30

Lo que me pregunto es... que tan necesario es el scroll??

porque no pones overflow: auto; y asi, si es necesario aparece, si no es necesario, se oculta!

Digo.. ahora si es necesario el scroll entonces creo que tendras que poner tu codigo para ver los padding y los margin

Saludos!

xdunkelheitx · #3 (**permalink**) 11/01/2009, 14:38

Cita:

Iniciado por CaLiZzZ

Lo que me pregunto es... que tan necesario es el scroll??

porque no pones overflow: auto; y asi, si es necesario aparece, si no es necesario, se oculta!

Digo.. ahora si es necesario el scroll entonces creo que tendras que poner tu codigo para ver los padding y los margin

Saludos!

mi overflow: esta en auto pero como es bastante texto se hace el scroll igual no soluciona el problema . Este es el codigo lo pude solucionar subiendo la <div> segunda> pero yo no quisiera que igual tuviera todo ese espacio ya que en mi dreamweaver tambien se ve ese espacio por mas que le pongo una altura determinada en su estilo. Espero me puedas ayudar =D

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<style type="text/css">
.frase{font-family:roman;}

body {
background-color: #000000;
background-image: url();
}

html {SCROLLBAR-FACE-COLOR: black;
BORDER-LEFT-COLOR: #545454;
SCROLLBAR-HIGHLIGHT-COLOR: #545454;
SCROLLBAR-SHADOW-COLOR:#545454;
SCROLLBAR-3DLIGHT-COLOR: #545454;
SCROLLBAR-ARROW-COLOR:#545454;
SCROLLBAR-DARKSHADOW-COLOR: #545454;}

#datos {
background-image: url(http://img522.imageshack.us/img522/6463/userdetailcopiagf6.png);
width:800px;
background-repeat:no-repeat;
position:relative;
left:160px;
height: 400px;
}
#datos .fotos { width:243px; height:279px; position:relative;left:529px;top:57px;}
.caja {background:#FFFFFF; border:#000000 dashed; width:450px;position:relative;top:-160px;left:30px; height:223px!important;}
.scroll { overflow: auto;height: 223px!important;}
.resumen{font-family:verdana;}
div.gustos{text-align:justify;width:425px!important; font-family:Geneva, Arial, Helvetica, sans-serif}

.caja:hover { background:#000000; color:#FFFFFF ; border: #FFFFFF dashed }
a img {border:0;}

#amigo{
width:950px;
}
ul#map {display: block; margin: 0; padding: 0; width: 950px; height: 130px; background-image: url(http://img356.imageshack.us/img356/1361/imagen2gf0.gif);}
ul#map li {display: block; padding: 0; position: absolute;}
li#cz1 {margin-top: 20px; margin-left: 34px;}
li#cz2 {margin-top: 20px; margin-left: 139px;}
li#cz3 {margin-top: 21px; margin-left: 243px;}
li#cz4 {margin-top: 20px; margin-left: 347px;}
li#cz5 {margin-top: 21px; margin-left: 448px;}
li#cz6 {margin-top: 22px; margin-left: 545px;}
li#cz7 {margin-top: 23px; margin-left: 638px;}
li#cz8 {margin-top: 23px; margin-left: 731px;}
li#cz9 {margin-top: 22px; margin-left: 823px;}
ul#map li a {display: block; text-decoration: none; position: absolute;}
a#z1,a#z2,a#z3,a#z4,a#z5,a#z6,a#z7,a#z8,a#z9 {width: 96px; height: 84px;}
a#z1:hover, a#z1:active {background-image: url('http://img519.imageshack.us/img519/4571/lidiaqc0.gif');}
a#z2:hover, a#z2:active {background-image: url('http://img185.imageshack.us/img185/751/fiorelinayk7.gif');}
a#z3:hover, a#z3:active {background-image: url('http://img246.imageshack.us/img246/5489/nathyqr2.gif');}
a#z4:hover, a#z4:active {background-image: url('http://img363.imageshack.us/img363/9493/janerycu4.gif');}
a#z5:hover, a#z5:active {background-image: url('http://img244.imageshack.us/img244/1802/melaniejn7.gif');}
a#z6:hover, a#z6:active {background-image: url('http://img374.imageshack.us/img374/181/solmd4.gif');}
a#z7:hover, a#z7:active {background-image: url('http://img519.imageshack.us/img519/2228/jeannetnz1.gif');}
a#z8:hover, a#z8:active {background-image: url('http://img168.imageshack.us/img168/8006/leydiks4.gif');}
a#z9:hover, a#z9:active {background-image: url('http://img147.imageshack.us/img147/9933/natyku6.gif');}
ul#map li a img {border: 0; width: inherit; height: inherit;}

.scroll1 {overflow: auto;height: 223px!important;}
</style></head>

<body>

<div id="datos">

<div class="fotos">
<a href="http://hi5.com/friend/photos/displayMyPhoto.do?photoId=3170637325&albumId=1 26789772&ownerId=78256227" target="_parent"><img src="http://img254.imageshack.us/img254/1734/animacionjq4.gif" width="243" height="279px"/></a></div>

<div class="caja">
<div class="scroll1">
<div class="frase">
<div align="center">"No tengo una frase en especial asi que se lo aguantan =D!!"</div>
</div>
<br/>
<center>
<div class="resumen"><b>Edad:</b> 19 años <br/>
<b>Cumpleaños:</b> 27 de setiembre<br/>
<b>Ubicacion:</b> Lima (por si no conocen PERU)<br/>
</div>
</center>
<br/>
<div class="gustos"> Bueno en resumen mi vida no es tan diferente al del resto...me gusta mucho la musica,desde muy chico creo por el hecho de ser familiar de muchos musicos...comenzando desde tocar tambor en la primaria, tocar trompeta en la secundaria y ahora disque tocando guitarra xD!! <br/>
Entre los generos no soy muy discriminador pero me inclino mas al ****rock**** entre un poco suave (punk rock)hasta mas fuerte (metal,hardcore) aunque e sido capaz de bailar de todo hasta el(poof por festejar numas) xD!!.<br/>
<br/>
Haber q hago....soy estudiante universitario(:P) y me gusta proyectarme metas pero siempre hay algo que tropieza, pero para adelante nomas seguir y conseguir todas mis espectativas jojojo </div>
</div>
</div>
</div>
<div id="amigo">
<ul id="map">
<li id="cz1"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=64669921" id="z1" title="Lidia"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz2"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=42204490" id="z2" title="Fiorellina"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz3"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=32737136" id="z3" title="Nathy"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz4"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=62946954" id="z4" title="Janery"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz5"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=3548430" id="z5" title="Melanie"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz6"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=19800024" id="z6" title="Zol"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz7"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=33541746" id="z7" title="Jeannet"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz8"><a href="http://hi5.com/friend/profile/displayProfile.do?userid=19296456" id="z8" title="Leydi"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
<li id="cz9"><a href="http://natix-love-14.hi5.com" id="z9" title="Naty"><img src="http://img84.imageshack.us/img84/5900/nullfr4.gif" /></a></li>
</ul>
</div>

</body>
</html>

Calizman · #4 (**permalink**) 11/01/2009, 14:40

Claro! tu problema esta en el principio!!

arriba de body, escribe esto

* {
margin: 0;
padding: 0;
}

Esto talvez solucione tu problema! si no lo hace me avisas y seguimos probando!

xdunkelheitx · #5 (**permalink**) 11/01/2009, 14:55

Bueno gracias por responder tan rapido pero eso no soluciona el problema :S

asi se mira en IE6

y asi en firefox 3

y asi en mi dreamweaber, como vez hay dos rayas de la div una es porque la hize a la medida exacta de la imagen para que no haya espacio pero el otro se hace por todo el contenido del scroll :S y no se como eliminar todo ese espacio.

Calizman · #6 (**permalink**) 11/01/2009, 15:01

Ok y el problema esta entre <div class="caja"> <div class="scroll1"> <div class="frase"> y <div id="amigo"> verdad? esos son los divs que te estan dando el problema?

EDITO: dijiste que habias hecho la caja exactamente al tamaño de la imagen pero dreamweaver te saca el gran espacio verdad? y si le quitas el tamaño al div? asi solo se acomodara al tamaño de la imagen, si la imagen crece, el div crece...

Intentalo!

xdunkelheitx · #7 (**permalink**) 11/01/2009, 15:06

<div id ="datos"> y <div id="amigo"> son los principales los otros 3 <div class="caja"> <div class="scroll1"> <div class="frase"> estan dentro de datos puede ser que el error sea entre las classes ya que ni poniendole medida exacta a la id datos puedo correjir el problema

xdunkelheitx · #8 (**permalink**) 11/01/2009, 16:10

le quite el tamaño exacto y se sigue viendo igual pero ahora en firefox aparecio el mismo espacio :S

Calizman · #9 (**permalink**) 11/01/2009, 16:21

uff... Si que me tienes pensando... lo peor de mi caso es que yo no utilizo IE.. y encima veo miles de errores en tu html y tu css... por lo que me estoy dedicando a corregir errores y luego de eso salen mas errores...

Ya dentro de poco espero tener la respuesta...!

xdunkelheitx · #10 (**permalink**) 11/01/2009, 16:23

gracias de verdad, azu tantos errores jeje espero mejorar para ya no tenerlos =D

Calizman · #11 (**permalink**) 11/01/2009, 16:24

jaja... no hay problema... por lo que veo estas haciendo tu propio hi5 no? esa hoja la vas a meter en tu estilo de vida para que aparezca asi? te lo digo porque yo inicie un negocio de eso... ahora cobro a mis amigos por arreglarles su hi5 y dejarlo como ellos quieren!

Por si te sirve la idea... =D

xdunkelheitx · #12 (**permalink**) 11/01/2009, 16:31

jojojo yo hago lo mismo pero no cobro en un foro para css hi5 pero bueno todavia no soy lo suficiente bueno y ahora como vez tengo problemas tediosos =D igual este es solo un ejemplo como recien empiezo a usar css gracias a que el hi5 solo usa eso pero ia estoy aprendiendo a hacer paginas con php y mysql solo que estoy practicando en diseño y css por eso q practico arreglando hi5.

Calizman · #13 (**permalink**) 11/01/2009, 16:34

foro? me suena... creo que he visto por ahi un foro sobre Hi5... geek team.. algo asi no? bueno... si no es ese.. igual tu hoja esta quedando muy diferente de como era... sinceramente que de problemas! ajaja... entiendo que la codificion no es lo tuyo pero... imagina que comenze una hoja nueva y de ahi voy copiando y pegando cosas de la tuya y haciendo la mia... pfff... dentro de poco termino y te paso la hoja, si aun asi no solucionas tu problema.. tendras que ingeniarte que poner en ese espacio! jaja...

xdunkelheitx · #14 (**permalink**) 11/01/2009, 16:44

bueno del geek-team no soy , pero sobre los errores me tienens insierto porque no puedo ver en donde me pueda haber confundido, seria bueno que me mandes los errores para poder aprender mi falla, de verdad te lo agradeceria =D.

Calizman · #15 (**permalink**) 11/01/2009, 16:46

Ok.. los errores son muchos, no puedo enviarte paso por paso los errores... pero en cuanto termine tu hoja completa te la enviare y ahi podras comparar tu hoja con la hoja que hice, ahi veras los problemas que tienes y si tienes alguna duda ya solo me preguntas.

Te parece?

xdunkelheitx · #16 (**permalink**) 11/01/2009, 16:49

claro no te preocupes =D. Esperare la hoja =D

Calizman · #17 (**permalink**) 11/01/2009, 16:50

Te envie un MP (mensaje privado) leelo y me cuentas

Calizman · #18 (**permalink**) 11/01/2009, 17:44

Espero que te haya servido la hoja!

Ya no me dijiste nada... asi que supuse que te sirvio...

Saludos!

Londrack · #19 (**permalink**) 09/10/2009, 08:39

Perdón si estoy reviviendo un tema muy viejo, pero... cómo hiciste para solucionarlo???
Tengo el mismo problema de espacios entre los divs :P

Calizman · #20 (**permalink**) 09/10/2009, 12:12

Saludos Londrack!

Seria mejor que abrieras un nuevo tema explicando tu problema mas detalladamente y con algun enlace hacia la pagina en cuestion.

Hasta Luego!