Pregunta

Estoy diseñando / construcción de un sitio, y como un buen desarrollador he estado manteniendo un ojo en cómo hacen las cosas en todos los navegadores populares - las versiones actuales de Firefox, Chrome, Safari (para Windows) y Chrome e Internet Explorer (8, no la vista previa 9).

De todos modos, todo parecía absolutamente bien en Chrome para mí, pero un amigo mío que me ha estado dando algunos comentarios me dijo "Ah, por cierto, el sitio se muestra terriblemente en Chrome." Le di las "obras en mi máquina" estándar respuesta, y me contestó que él pensaba que debe ser un problema de extensión.

Me dio una breve lista de las extensiones populares que utiliza, y después de un poco de ensayo y error he descubierto las mentiras de problemas con AdBlock. Yo no aburrir demasiado con los detalles del problema representación real, pero nos dimos cuenta de algo extraño. No era que AdBlock estaba bloqueando algo en la página, pero que la mera presencia de AdBlock en Chrome fue la causa del problema. Lo sé porque los problemas persiste incluso cuando a) AdBlock hago una pausa, y b) cuando excluyen específicamente a esa página y / o Zona de ser AdBlocked.

Desde entonces, he solucionado el problema (que lo había notado antes en un Firefox 3.0 "BrowserShot", pero corregido el error dentro de FireBug única - que no se había aplicado a la copia verdadera aún), pero me ha dejado preguntando si hay otros problemas que debería tener en cuenta.

No parece ser una cuestión de Peculiaridades frente al modo ya sea Normas. Sigue apareciendo el document.compatMode (modo estándar) "CSS1Compat", y cuando se quita la definición tipo de documento a modo de disparo peculiaridades, el sitio todavía se representa correctamente (aunque con algo de relleno cambiado en lugares - nada de que preocuparse)

.

¿Alguien ha notado este problema antes? ¿El AdBlock cambiará fundamentalmente la forma de cromo hace que las páginas, incluso si no está activa en ese sitio específico?


Editar # 1:

Se pone más raro. Intenté crear un ejemplo, pero no lo hacen incorrectamente por alguna razón. En última instancia, he copiado del original (es decir, en su defecto) html en un archivo nuevo, y lo arrojó todo el archivo CSS en una etiqueta en el <style> <head> del documento. Es Todavía funcionado.

Un poco de ensayo y error, y he determinado que el problema sólo existe cuando incluyendo CSS a través de <link rel="stylesheet"> pero no a través de <style>.

Podría alguien por favor explicar lo que está pasando aquí?


Editar # 2:

Este es el código que estoy trabajando con:

HTML:

<!DOCTYPE html>
<html>
  <head>
    <title>Demo</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="style.css" />
  </head>
  <body>
    <div id="outer">
      <img src="placeholder.png" width="150px" height="150px" />
      <div id="inner">
        <h1>Test</h1>
        <p>Lorem ipsum blah blah blah</p>
      </div>
    </div>
  </body>
</html>

CSS:

    #outer {
      border: 1px solid #000;
      width: 700px;
    }

    #inner {
      float: right;
      width: 540px;
    }

Si desea probar esto por sí mismo, he puesto algunos archivos en mi servidor:

¿Fue útil?

Solución

Parece ser un problema en la forma contenido de cromo reflujos después de CSS ha sido modificado - se puede reproducir exactamente la misma prestación siguiendo estos pasos:

  1. Desactivar AdThwart, recarga de cromo.
  2. cargar la página (cualquiera de los dos).
  3. Go en el inspector de Chrome -. Seleccionar el elemento interior div #
  4. Desactivar, vuelva a activar, el atributo float: right; CSS.

Sería una buena idea para presentar un informe de error, si no existe ya. - Es bien una WebKit o un error Chrome

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top