yurikhan: (Default)

Когда я пришёл в веб, считалось дурным тоном делать сайты, не помещающиеся в 800×600.

Потом распространились разрешения 1024×768, 1152×864, 1280×1024 и, наконец, 1600×1200. В какой-то момент вебостроители решили, что 1024 пикселя в ширину есть у всех. А у кого нет, тот лох.

Потом пошла мода на 16:10 и 16:9 и разрешения типа 1920×1080. И вот про это разрешение поговорим подробнее.

Дело в том, что при 24 дюймах диагонали, формате 16:9 и разрешении 1920×1080 CSS-пикселей (тех, которые 1/96 дюйма, а не обязательно один минимальный элемент изображения) уже начинает быть удобно работать не с одним развёрнутым на весь экран окном, а с двумя неперекрывающимися половинками. И в такой конфигурации сайту в браузере остаётся 960px ширины, с поправкой на скроллбар — ≈940px.

Сто́ит вспомнить правила приличия девяностых и двухтысячных. Сайт не должен вызывать горизонтального скроллинга при ширине окна в 940px.

(Персональные лучи поноса — Альфа-Клику, Гитхабу, Гуглу, Джире, Пейпэлу, библиотеке Сафари Букс Онлайн, всей сети Стек Эксчендж и Яндекс-Погоде.)

yurikhan: (Default)

У Google есть почта. У неё есть фича: рекламный блок. Это было бы ничего, если бы он был внизу. Но он справа и отнимает 189px ширины окна. К счастью, во многих браузерах есть возможность задать дополнительный stylesheet.

Открываем DOM Inspector, тыкаем в рекламу. Поднимаясь по дереву, видим, что ближайший адресуемый блок имеет класс yxEQwb. Открываем $(profile)/chrome/userContent.css (для Firefox; в IE положение дополнительного CSS настраивается через диалог Internet Options), пишем:

/*
 * GMail ads 2007-11
 */
.yxEQwb { display: none !important; }

Перезапускаем Firefox. Рекламы больше нет, но остался блок с ссылками New window и Print all. Их можно было бы убрать аналогичным образом, но они могут когда-нибудь понадобиться. Так что мы их уберём в другое место. Скажем, в правый нижний угол окна. Кроме того, пусть им будет какая-нибудь ненавязчивая рамочка.

Если верить DOM Inspector’у, они лежат в блоке с классом yMuNaf (всегда поражаюсь, как в Google умеют точно, кратко и понятно выразить назначение блока).

.yMuNaf
{
  position: fixed !important;
  bottom: 0px !important;
  right: 0px !important;
  border: 1px solid silver !important;
}

Ещё раз перезапускаемся. Кнопки уехали на место, но колонка свободного места осталась.

Смотрим в дерево. Видим, что там таблица на три колонки, из которых нам мешает третья. Но выделить её из трёх ни по классу, ни по id’у не получается.

Спускаемся внутрь, видим там <div> класса XoqCub с явно заданной шириной: style="width: 189px;". XoqCub’ов на странице полно. Попробуем подобрать правильный селектор:

.XoqCub[style] { border: 3px solid red !important; }

Ууу, сколько их много.

.eWTfhb>.XoqCub[style] { border: 3px solid red !important; }

А вот так уже нормально.

.eWTfhb>.XoqCub[style] { width: 0px !important; }

Ооо. Much better. Только правый край письма просвечивает через кнопки. И кнопки неплохо бы отбить чуть-чуть по краям.

.yMuNaf
{
  position: fixed !important;
  bottom: 0px !important;
  right: 0px !important;
  border: 1px solid silver !important;
  background: white !important;
  padding: 0px 3px !important;
}

Вот теперь можно жить.

yurikhan: (Default)

Находим свой Firefox’ный профайл (%AppData%\Mozilla\Firefox\Profiles). В подкаталоге chrome редактируем userContent.css (если его нет, то создаём чистый). Добавляем:

/*
 * Kill LiveJournal Navigation Strip
 */
table#lj_controlstrip { display: none !important; }

Да, и заодно ещё этого козла, который после написания записи начинает предлагать Plus account и прочую фигню.

#CProd_box { display: none !important; }

Перезапускаем браузер. Время от времени, когда руководству LJ приспичит что-то поменять, обновляем.

Profile

yurikhan: (Default)
Yuri Khan

May 2017

S M T W T F S
 123 456
78910 111213
14 151617181920
21 222324252627
28293031   

Links

Syndicate

RSS Atom

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated 2017-05-29 17:09
Powered by Dreamwidth Studios