Материалы с тегом «позиционирование»

• inline-block: простое свойство для непростых задач

  inline-block совмещает в себе возможности блочных элементов (block) и некоторые особенности поведения строчных (inline). Преимуществом такого симбиоза можно и даже нужно пользоваться.

• Вертикальная позиция для строчного (inline) элемента

  О том как с помощью position: relative можно задать вертикальную позицию для строчного элемента.

• Вертикальное выравнивание по центру

  Вертикальное выравнивание относительно родителя

• Вычисляемые отступы

  Порой не хватает возможности вычислений отступов в CSS — margin-left: 30%-100px. Хотя в таком виде в CSS нет подобных правил, их несложно проэмулировать.

• Два в одном: позиция + размеры

  Иногда так хочется написать что-то вроде height: 100% — 20px; а нельзя! Или все-таки можно?

• Долой отступы между строчными элементами (и блоками)

  Поставь несколько строчных элементов (или строчных блоков) подряд и между ними, как по волшебству, образуется небольшой, но очень вредный отступ — убрать его достаточно трудно. Но можно. Чем и займемся в данной статье.

• Обходим схлопывание margin

  Каким образом можно убрать нежелательное схлопывание margin. Рассмотрен ряд методов, у каждого из которых свои достоинства и недостатки и своя область применения.

• Позиционирование блока по центру с учетом скрола

  Скрипт, который кроссбраузерно позиционирует блок по середине с учетом прокрутки окна браузера.

• Свойство bottom

  CSS свойство bottom устанавливает позицию нижней границы элемента относительно нижней границы родителя.

• Свойство left

  CSS свойство left задает расстояние от левого края родителя

• Свойство position

  CSS свойство position устанавливает способ позиционирования элемента на веб странице.

• Свойство right

  CSS свойство right задает позицию правого края элемента относительно правой стороны родителя.

• Свойство top

  CSS свойство top задает позицию верхнего края элемента относительно верхней стороны родителя.

• Свойство z-index

  CSS свойство z-index задает положение на z-оси, т.е. какой из элементов будет виден, если они наложатся друг на друга.

• Смещение на 1px в IE6

  О том как устранить смещение блоков на 1px при position: absolute; right:0 и/или bottom:0.

• Фиксированный блок с изменяющимся отступом сверху

  Реализуем блок всегда видимый на экране, при любом положении прокрутки. Ключевой момент задачи — отступ блока сверху вычисляется динамически, в зависимости от положения вертикального скролла.

• Центрирование картинки в блоке

  Еще один метод выровнять картинку в пределах блока с фиксированным размером

• Центрирование резинового блока по горизонтали

  Кроссбраузерное выравнивание резинового блока по центру далеко не такая простая задача, как кажется на первый взгляд.

• Элемент с position: absolute по центру родителя

  О том как выровнять блок с абсолютным позиционированием по центру без использования JS.