Обновляемый сборник Способы заработка в интернете
Учебное пособие
Свой бизнес на файлах (пошагово)
Пассивный доход за счёт инвестирования Куда сегодня можно вложить деньги

Раздел "Инструкции и методы"
Основа данного раздела - это пошаговые описания решений определённых задач в сайтостроении (вёрстка, web-дизайн, программирование и прочее), примеры решения различных трудностей с помощью полезного софта, а также некоторые другие интересные материалы

Если вы уже занимались версткой веб-страниц, то вам, вероятнее всего, приходилось сталкиваться с проблемой центрирования блоков (div) по горизонтали и вертикали. Самый применяемый метод центрирования – это, несомненно, стили CSS.
Для начала вы должны определиться с шириной и высотой используемого блока. При горизонтальном центрировании с помощью CSS необходимо поставить для левой и правой границы значение auto (как показано на рисунке).

Данный способ используется для блочных элементов, таких как div, p, h1 и др. Для применения метода к гиперссылкам или изображениям, требуется использовать дополнительное правило – display:block.
Немного замысловатей будет выглядеть реализация одновременно горизонтального и вертикального центрирования.

Абсолютное позиционирование, указанное на рисунке, отделяет блок от среды, устанавливая его расположение по отношению к окну браузера. Слева и сверху устанавливается значение 50%, в результате чего блок разместится в центре окна. Последняя строчка кода в примере смещает блок влево и вверх, ввиду отрицательных значений, для наилучшего расположения.
Как вы видите, все легко и просто. Но лишь до тех пор, пока блок имеет фиксированный размер. При других раскладах не обойтись без центрирования с помощью jQuery.

Каждый раз, когда пользователь изменяет размер окна, функция высчитывает ширину. Этот способ весьма удобен, но работать он будет только с включенным JavaScript.
Хотите создать свой бизнес, но не знаете с чего начать? Читайте о том, как сделать готовый бизнес-план на сайте Financial-Lawyer.
Copyright © 2007-2012 Николай Мурашкин | Хостинг сайта
Копирование, а также любое другое подобное использование материалов без ссылки на сайт NikMurashkin.RU строго запрещено!