content top

CSS-хаки, трюки и жестокие обманы валидатора

CSS-хаки, трюки и жестокие обманы валидатора

Обманывать не хорошо, так в детстве мама говорила, но иногда без этого никак… В web-верстке тоже самое – нужен хак, и заказчик требует валидность, а еще и в портфолио потом работу выкладывать. Вот и приходится хитрить, хотя, по сути, верстка страничка всё равно невалидна, просто обманутый валидатор этого не замечает (да и не хочет он это замечать). Как бы не вопили противники хаков, от этого никуда не уйти.

Постараюсь максимально выложить всё что знаю по этой теме, а что сразу не вспомню (или пока не знаю) буду со временем дописывать…

Далее

Прижимаем подвал (footer) к низу экрана

Прижимаем подвал (footer) к низу экрана

Не всегда страничка должна иметь много контента (например страничка с сообщением об ошибке 404), а красивый подвал посреди экрана выглядит как-то неуместно. Надо бы его прижать :)

Логический алгоритм следующий:

  1. Высоту странички body выставляем в 100% (минимум);
  2. Основной слой (page), в котором будет шапка (header) и контент (content) так же растягиваем на 100% по высоте;
  3. Подвал (footer) прижимаем книзу position:relative; bottom:0;
  4. Т.к. подвал находится ниже 100% слоя page, то нужно его поднять на столько, сколько он сам имеет роста: margin-top:-50px;
  5. Теперь страничка и без скрола, и подвал внизу, но при нынешнем состоянии контент будет залезать под подвал, применим-ка мы к нему pading-bottom:60px;
Далее

Стандартные шрифты для сайта

Стандартные шрифты для сайта

К сожалению, в стиле сайта нельзя назначить любой шрифт для текста (всякие хитроумные приемы и флеш в расчет не беру).  Браузеры используют ограниченное количество стандартных шрифтов, постараюсь показать то что есть…

Стандартные шрифты:

1. Arial
2. Verdana
3. Times
4. Times New Roman
5. Georgia
6. Trebuchet MS
7. Sans
8. Sans
9. Comic Sans MS
10. Courier New
11. Webdings
12. Garamond
13. Helvetica
Далее
content top