Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Div traidor se visualiza bien en Firefox y no en Chrome

Estas en el tema de Div traidor se visualiza bien en Firefox y no en Chrome en el foro de CSS en Foros del Web. ¡Buenas a todos! Como digo en el título, tengo un div que me está haciendo la puñeta, porque en Firefox se muestra en su sitio, ...
  #1 (permalink)  
Antiguo 30/12/2014, 02:49
 
Fecha de Ingreso: diciembre-2014
Mensajes: 5
Antigüedad: 9 años, 3 meses
Puntos: 0
Div traidor se visualiza bien en Firefox y no en Chrome

¡Buenas a todos!

Como digo en el título, tengo un div que me está haciendo la puñeta, porque en Firefox se muestra en su sitio, pero en Chrome no (de IE paso un poco).

La cosa es: Un div grande y hermoso, centrado en la pantalla, que contiene dos divs mas pequeños, y quiero que uno se quede a la derecha, y otro a la izquierda, ambos pegando a la parte superior del div principal, y les tengo puesto el siguiente codigo CSS, donde #principal es el div grande, y #cuadradete 1 y 2 son los divs que tienen que estar a la izquierda y a la derecha respectivamente:

Código CSS:
Ver original
  1. #principal{
  2.         width: 80%;
  3.         background-color:yellow;
  4.         position:relative;
  5.         margin: 0 auto;
  6.         left: 0;
  7.         right: 0;
  8.         border: 3px solid blue;
  9.         opacity:0.70;
  10.            
  11.         z-index: 0;
  12.     }
  13.  
  14.     #cuadradete{
  15.         width: 100px;
  16.         height: 100px;
  17.         background-color:transparent;
  18.         position:absolute;
  19.         left:0;
  20.         top:0;
  21.            
  22.         z-index: 1;
  23.     }
  24.  
  25.     #cuadradete2{
  26.         width: 100px;
  27.         height: 100px;
  28.         background-color:transparent;
  29.         position:absolute;
  30.         right:0;
  31.         top:0;
  32.            
  33.         z-index: 1;
  34.     }

Código HTML:
Ver original
  1. <div id="principal">
  2.  
  3.         [Otros contenidos varios...]
  4.  
  5.         <div id="cuadradete"></div>
  6.        
  7.         <div id="cuadradete2"></div>
  8.     </div>
  #2 (permalink)  
Antiguo 30/12/2014, 02:57
 
Fecha de Ingreso: diciembre-2014
Mensajes: 111
Antigüedad: 9 años, 3 meses
Puntos: 9
Respuesta: Div traidor se visualiza bien en Firefox y no en Chrome

Prueba a flotarlos a izquierda y derecha respectivamente

float:left;
float: right;
  #3 (permalink)  
Antiguo 31/12/2014, 12:13
Avatar de andresgarciadev  
Fecha de Ingreso: junio-2013
Mensajes: 218
Antigüedad: 10 años, 8 meses
Puntos: 32
Respuesta: Div traidor se visualiza bien en Firefox y no en Chrome

pues los probe y no veo ninguna diferencia en google o chrome, creo que debes tener otro stilo en la pagina que los esta afectando por que con lo que nos muestras no deberia haber problema
http://jsfiddle.net/q1102yzz/
  #4 (permalink)  
Antiguo 31/12/2014, 13:55
Avatar de mbm150  
Fecha de Ingreso: enero-2013
Ubicación: Muskiz
Mensajes: 79
Antigüedad: 11 años, 2 meses
Puntos: 21
Respuesta: Div traidor se visualiza bien en Firefox y no en Chrome

Hola

Código CSS:
Ver original
  1. #principal{
  2.     width: 80%;
  3.     background-color:yellow;
  4.     position:relative;
  5.     margin: 0 auto;
  6.     border: 3px solid blue;
  7.     opacity:0.70;
  8.     overflow: hidden;
  9. }
  10. #cuadradete{
  11.     width: 100px;
  12.     height: 100px;
  13.     background-color:red;
  14.     position:relative;
  15.     display:block;
  16.     float:left;
  17. }    
  18. #cuadradete2{
  19.     width: 100px;
  20.     height: 100px;
  21.     background-color:blue;
  22.     position:relative;
  23.     display:block;
  24.     float: right;
  25.     z-index: 1;
  26. }

Prueba así.

Saludos.
  #5 (permalink)  
Antiguo 05/01/2015, 02:38
 
Fecha de Ingreso: diciembre-2014
Mensajes: 5
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: Div traidor se visualiza bien en Firefox y no en Chrome

Efectivamente, en realidad el CSS estaba bien... El problema viene desde un javascript que tengo puesto para que se muevan por la pantalla, que por algún extraño motivo, los esquina a los dos juntos arriba a la derecha en chrome (no en firefox, vaya usted a saber por qué)

De todas formas, eso ya lo ire investigando

Muchas gracias a todos, y feliz año ;)

Etiquetas: divs
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 08:01.