Non AdBlock cambiamento come Chrome visualizza le pagine?

StackOverflow https://stackoverflow.com/questions/4013582

Domanda

Sto progettando / costruzione di un sito, e come un bravo sviluppatore ho tenuto d'occhio su come le cose rendono in tutti i browser più diffusi - le versioni attuali di Firefox, Chrome, Safari (per Windows) e Chrome e Internet Explorer (8, non l'anteprima 9).

In ogni caso, tutto sembrava assolutamente bene in Chrome per me, ma un mio amico che mi è stata dà qualche feedback mi ha detto: "Oh, a proposito, il sito viene visualizzato orribilmente in Chrome." Gli ho dato le "opere sulla mia macchina" standard di risposta, e lui mi ha risposto che pensava che deve essere un problema di estensione.

Lui mi ha dato un breve elenco delle estensioni popolari che usa, e dopo un po 'di tentativi ed errori ho scoperto le bugie problema con AdBlock. Io non voglio annoiarvi troppo con i dettagli del problema di rendering vero e proprio, ma abbiamo notato qualcosa di strano. Non che AdBlock stava bloccando qualcosa sulla pagina, ma che la semplice presenza di AdBlock in Chrome è stata la causa del problema. Lo so perché il problema persiste anche quando a) mi fermo AdBlock, e b) quando ho espressamente escludere tale pagina / sito dall'essere AdBlocked.

Da allora ho risolto il problema (che aveva notato in precedenza in un Firefox 3.0 "BrowserShot", ma fissa il bug all'interno FireBug solo - non avevo applicata alla copia reale ancora), ma mi ha lasciato chiedevo se ci sono altri problemi che dovrei essere a conoscenza.

Non sembra essere una questione di stranezze vs. modalità Standard sia. document.compatMode ancora spettacoli "CSS1Compat" (modalità Standard), e quando rimuovo la definizione doctype alla modalità di trigger stranezze, il sito rende ancora correttamente (anche se con un po 'imbottitura cambiato in posti - niente di cui preoccuparsi)

.

Qualcuno ha notato questo problema prima? Non AdBlock cambiare radicalmente il modo in cui Chrome rendering delle pagine, anche se non è attiva su quel sito specifico?

Modifica # 1:

Si ottiene più strano. Ho cercato di creare un esempio, ma non sarebbe il rendering in modo improprio per qualche motivo. In ultima analisi, ho copiato l'originale (vale a dire non) html all'interno di un nuovo file, e gettò l'intero file CSS in un tag <style> nel <head> del documento. E ' ancora funzionato.

Un po 'di tentativi ed errori, e ho stabilito che il problema esiste solo quando tra cui CSS tramite <link rel="stylesheet"> ma non via <style>.

Potrebbe qualcuno si prega di spiegare cosa sta succedendo qui?

Modifica # 2:

Ecco il codice con cui sto lavorando: 

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;
    }

Se vuoi provare questo per te stesso, ho messo alcuni file sul mio server:

È stato utile?

Soluzione

Sembra essere un problema nel modo in cui Chrome rimborsi contenuto dopo css è stato modificato - è possibile riprodurre esattamente la stessa resa nel seguente modo:

  1. Disattiva Adthwart, reload cromato.
  2. caricare la pagina (uno dei due).
  3. Vai nella finestra di ispezione Chrome -. Selezionare l'elemento interno div #
  4. Disattiva, riattivare, l'attributo float: right; CSS.

Sarebbe una buona idea di presentare un bug report, se non esiste già -. È sia un WebKit o un bug Chrome

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top