Изменяет ли AdBlock способ отображения страниц в Chrome?

Я проектирую / строю сайт, и, как хороший маленький разработчик, я слежу за тем, как все отображается во всех популярных браузерах - в текущих версиях Firefox, Chrome, Safari (для Windows) и Chrome, а также в Интернете. Проводник (8, а не 9 превью).

Как бы то ни было, в Chrome все выглядело абсолютно нормально, но мой друг, который дал мне какую-то обратную связь, сказал мне: "О, кстати, ваш сайт ужасно отображается в Chrome". Я дал ему стандартный ответ "работает на моей машине", и он ответил, что, по его мнению, это проблема расширения.

Он дал мне краткий список популярных расширений, которые он использует, и после небольшого количества проб и ошибок я обнаружил, что проблема заключается в AdBlock. Я не буду утомлять вас подробностями проблемы рендеринга, но мы заметили нечто странное. Дело не в том, что AdBlock что-то блокировал на странице, а в том, что простое присутствие AdBlock в Chrome вызывало проблему. Я знаю это, потому что проблема сохраняется даже тогда, когда а) я приостанавливаю AdBlock и б) когда я специально исключаю эту страницу / сайт из блокировки AdBlock.

С тех пор я исправил проблему (я заметил это ранее в Firefox 3.0 "BrowserShot", но исправил ошибку только в FireBug - я еще не применил ее к реальной копии), но это заставило меня задуматься, есть ли Есть другие вопросы, которые я должен знать.

Похоже, это не вопрос "Причуд против режима стандартов". document.compatMode по-прежнему показывает "CSS1Compat" (стандартный режим), и когда я удаляю определение doctype для запуска режима причуд, сайт по-прежнему отображается правильно (хотя с некоторыми изменениями местами местами - не о чем беспокоиться).

Кто-нибудь заметил эту проблему раньше? Изменяет ли AdBlock способ отображения страниц в Chrome, даже если он не активен на этом конкретном сайте?

Редактировать № 1:

Это становится страннее. Я пытался создать пример, но по какой-то причине он не будет отображаться неправильно. В конечном итоге я скопировал исходный (то есть с ошибкой) HTML-файл в новый файл и бросил весь файл CSS в <style> тег в <head> документа. Это все еще работало.

Немного проб и ошибок, и я решил, что проблема существует только при включении CSS через <link rel="stylesheet"> но не через <style>,

Может кто-нибудь объяснить, что здесь происходит?

Редактировать № 2:

Вот код, с которым я работаю:

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

Если вы хотите попробовать это сами, я поместил несколько файлов на свой сервер:

Источник

1 ответ

Решение

Кажется, проблема в том, как Chrome перекомпоновывает контент после изменения css - вы можете воспроизвести точно такой же рендеринг, выполнив следующие действия:

  1. Отключить Adthwart, перезагрузить хром.
  2. Загрузите страницу (любую из двух).
  3. Зайдите в инспектор Chrome - выберите элемент div#inner.
  4. Деактивировать, затем активировать, float: right; Атрибут CSS.

Было бы неплохо подать отчет об ошибке, если он еще не существует - это либо ошибка WebKit, либо Chrome.

Источник
Другие вопросы по тегам