Foros del Web » Creando para Internet » CSS »

Problema con posición de Divs en IE

Estas en el tema de Problema con posición de Divs en IE en el foro de CSS en Foros del Web. Muy buenas, que tal :) ? Bueno aquí vengo con el dichoso problema del IE XD Ya me rompí la cabeza intentando solucionarlo pero nada ...
  #1 (permalink)  
Antiguo 17/08/2010, 11:49
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 8 meses
Puntos: 15
Problema con posición de Divs en IE

Muy buenas, que tal :) ?
Bueno aquí vengo con el dichoso problema del IE XD Ya me rompí la cabeza intentando solucionarlo pero nada de nada.
Os cuento. Tengo un jquery deslizante, en el cual dentro hay un par de divs con na foto y texto. En Firefox se ve de perla, pero en IE falla. Os dejo una mini-captura para que lo vean, aun así les pongo la web:

Firefox



Internet Explorer


Os dejo el código:

Código HTML:
Ver original
  1. <div id="my-glider">
  2.   <div class="controls">
  3.         <br>
  4.         <ul style="text-align:center;">
  5.             <li><a href="#section1">AM</a></li>
  6.             <li><a href="#section2">A1</a></li>
  7.             <li><a href="#section3">A2</a></li>
  8.             <li><a href="#section4">A</a></li>
  9.         </ul><!-- cierra ul -->
  10.    </div><!-- cierra div -->
  11.    
  12.     <br>
  13.     <div class="scroller">
  14.         <div class="content">
  15.             <div class="section" id="section1">
  16.             <div class="caja_permiso_img">
  17.                 <div class="caja_permiso_img_in">
  18.                     <img src="<?php imagenPermiso(1); ?>" width="160px" />
  19.                  </div>
  20.             </div>
  21.             <div class="caja_permiso_contenido">
  22.                 <div class="caja_permiso_titulo">
  23.                     <?php echo $am_t; ?>
  24.                 </div>
  25.                 <div class="contenido_separacion">
  26.                     <?php echo $am; ?>
  27.                 </div>
  28.             </div>
  29.             </div>
  30.             <div class="section" id="section2">
  31.                 <div class="caja_permiso_img">
  32.                 <div class="caja_permiso_img_in">
  33.                     <img src="<?php imagenPermiso(2); ?>" width="160px" />
  34.                  </div>
  35.             </div>
  36.             <div class="caja_permiso_contenido">
  37.                 <div class="caja_permiso_titulo">
  38.                     <?php echo $a1_t; ?>
  39.                 </div>
  40.                 <div style="margin-left:10px;">
  41.                     <?php echo $a1; ?>
  42.                 </div>
  43.             </div>
  44.             </div>
  45.             <div class="section" id="section3">
  46.                 <div class="caja_permiso_img">
  47.                 <div class="caja_permiso_img_in">
  48.                     <?php $img_permi = ""; ?>
  49.                     <img src="<?php imagenPermiso(3); ?> " width="160px" />
  50.                  </div>
  51.             </div>
  52.             <div class="caja_permiso_contenido">
  53.                 <div class="caja_permiso_titulo">
  54.                     <?php echo $a2_t; ?>
  55.                 </div>
  56.                 <div style="margin-left:10px;">
  57.                     <?php echo $a2; ?>
  58.                 </div>
  59.             </div>
  60.             </div>
  61.             <div class="section" id="section4">
  62.                 <div class="caja_permiso_img">
  63.                 <div class="caja_permiso_img_in">
  64.                     <?php $img_permi = ""; ?>
  65.                     <img src="<?php imagenPermiso(4); ?>" width="160px" height="99px" />
  66.                     <!-- <img src="contenido/imagenes/permiso_am_prueba.jpg" width="160px" height="99px" />-->
  67.                  </div>
  68.             </div>
  69.             <div class="caja_permiso_contenido">
  70.                 <div class="caja_permiso_titulo">
  71.                     <?php echo $a_t; ?>
  72.                 </div>
  73.                 <div style="margin-left:10px;">
  74.                     <?php echo $a; ?>
  75.                 </div>
  76.             </div>             
  77.             </div>
  78.         </div>
  79.     </div>         
  80. </div>


CSS
Código CSS:
Ver original
  1. .permisos{
  2.     width:710px;
  3.     height:442px;
  4. }
  5.  
  6.     .caja_permiso_img{
  7.         width:190px;
  8.         float:left;
  9.     }
  10.    
  11.     .caja_permiso_img_in{
  12.         width:170px;
  13.         border-right:1px dashed #CCCCCC;
  14.         height:220px;
  15.         float:left;
  16.     }
  17.    
  18.     .caja_permiso_contenido{
  19.         width:490px;
  20.         float:right;
  21.     }
  22.    
  23.     .contenido_separacion{
  24.         margin-left:10px;
  25.     }
  26.    
  27.     .caja_permiso_titulo{
  28.         background-color:#e7e7df;
  29.         margin-bottom:20px;
  30.         width:100&#37;;
  31.         font-size:26px;
  32.         font-weight:bold;
  33.         padding:10px;
  34.         color:#8C8C8C;
  35.         font-family:Arial, Helvetica, sans-serif;
  36.         size:25px;
  37.         text-transform:uppercase;
  38.     }

A ver que puede ser.... porque ya no se ! me quedé así xDDD

Saludos y gracias !
__________________
Os iusti meditabitur sapientiam
Si te he ayudado, por qué no un poquito de Karma :) ?
  #2 (permalink)  
Antiguo 17/08/2010, 12:35
Avatar de TuWebBook  
Fecha de Ingreso: julio-2010
Ubicación: Gijón(Xixón)-Asturias(Asturies)
Mensajes: 580
Antigüedad: 7 años, 5 meses
Puntos: 17
Respuesta: Problema con posición de Divs en IE

probaste a modificar las anchuras de los div o de la imagen que tiene AM??
__________________
En SEOArticulo encontrarás trucos para crecer en Youtube, Posicionamiento Web en Google, Marketing Online, ganar dinero en internet...
  #3 (permalink)  
Antiguo 17/08/2010, 13:54
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 8 meses
Puntos: 15
Respuesta: Problema con posición de Divs en IE

He probado de todo .. :( y nada. .. y eso que me has comentado lo hice lo primero
__________________
Os iusti meditabitur sapientiam
Si te he ayudado, por qué no un poquito de Karma :) ?
  #4 (permalink)  
Antiguo 17/08/2010, 14:45
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Problema con posición de Divs en IE

Sería más efectivo si pudiese poner un enlace al problema, pues al ejecutar los códigos que publicó (a parte de que es el programado y no el generado), obtengo un resultado diferente al que muestra en las capturas.

Atentamente
  #5 (permalink)  
Antiguo 17/08/2010, 16:02
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 posición de Divs en IE

Como ya dijo el compañero kseso?, sería conveniente ver el sitio, o como alternativa muéstranos el código que se genera después cuando lo visualizas en el explorador

y si nos haces favor de incluir el css de estas clases scroller, content, section
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #6 (permalink)  
Antiguo 18/08/2010, 08:22
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 8 meses
Puntos: 15
Respuesta: Problema con posición de Divs en IE

Perdonar, no la pude subir hasta ahora, falta de tiempo. Aquí os dejo la web:

http://pruebas.zemula.net/autoescuel...misoa#section1
__________________
Os iusti meditabitur sapientiam
Si te he ayudado, por qué no un poquito de Karma :) ?
  #7 (permalink)  
Antiguo 18/08/2010, 09:11
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Problema con posición de Divs en IE

Reduzca la anchura de .caja_permiso_img a unos 160px (más o menos) y a .caja_permiso_contenido cámbiele el float a right. No se si eso tendrá algún efecto en otras secciones de web. En caso de ser necesario, pude añadir a esta última un margen derecho con valor negativo.

Pero posíblemente fuese conveniente una limpieza o cura de divitis (opinión muy subjetiva al no haber verificado a fondo los porqués de tanta caja).

Por ejemplo, .caja_permiso_titulo podría se sustituida por un hnº para alojar el título y .contenido_separacion podría ser innecesario al aplicando propiedades a los p y lo mismo para las dos cajas que utiliza para alojar la imagen de la izquierda.

Atentamente

P.D.: Échele un vistazo al validador, marca entre otras cosas un div sin abrir y no le reconoce la apertura del <head>, lo mismo para el css

Última edición por kseso?; 18/08/2010 a las 09:17

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 16:10.