Свойство CSS bottom

Поддержка браузерами

Браузеры для ПК
Internet Explorer Chrome Opera Safari Firefox Edge
5.0+ 1.0+ 6.0+ 1.0+ 1.0+ 12+
Браузеры для планшетов и мобильных устройств
Android webview Chrome для Android Edge Mobile Firefox для Android Opera для Android iOS Safari Samsung Internet
Да Да Да 4.0+ Да Да Да

Краткая информация

Значение по умолчанию auto
Наследуется Нет
Применяется Ко всем элементам
Аналог HTML Нет
Реализация в javascript
document.getElementById('idElement').style.bottom = '10px';
в данном случае элементу с id='idElement' будет добавлен стиль
bottom:10px;
Результат будет следующий, допустим id='idElement' имеет тег div, тогда:
<div id="idElement" style="bottom:10px;">...</div>
Реализация в jQuery
$('#idElement').css('bottom','10px');
в данном случае элементу с id='idElement' будет добавлен стиль
bottom:10px;
Результат будет следующий, допустим id='idElement' имеет тег div, тогда:
<div id="idElement" style="bottom:10px;">...</div>

Поддерживающие версии CSS

CSS 1 CSS 2 CSS 2.1 CSS 3

Описание

Задает вертикальное положение нижнего края элемента. Положение элемента зависит от значения position самого элемента и его родителя.

1. В случае если у элемента свойство bottom задано как absolute (абсолютно позиционированных), устанавливает положение нижнего края:

2. В случае если у элемента свойство bottom задано как fixed (фиксировано позиционированных), устанавливает положение нижнего края элемента до нижнего края экрана.

3. В случае если у элемента свойство bottom задано как relative (относительно позиционированных), устанавливает на какое расстояние, элемент перемещается относительно его нормального положения

4. В случае если у элемента свойство bottom задано как static (статично позиционированных), добавление свойства bottom никак не изменяет его положение.

Синтаксис

bottom: значение | auto | inherit;

Например:

... bottom: 20px; ...

Значения

значение

Отрицательное, нулевое или положительное значение нижнего края элемента в пикселях или других единицах измерения CSS

inherit Наследует значение родителя.
auto

Положение элемента не изменяется.

Браузер самостоятельно рассчитывает положение нижнего края элемента исходя из его высоты.

Пример

bottom:0;
bottom:60px;
bottom:30%;
bottom:7em;

Результат

В этом блоке показан пример использования свойства bottom:0;.