# right

/Internet Explorer | /Netscape | /Opera | /Safari | /Firefox
6.0 | 7.0 | 8.0 | 8.0 | 9.0 | 8.0 | 9.2 | 9.5 | 1.3 | 2.0 | 3.1 | 1.5 | 2.0 | 3.0
Помилки | Частково | Так | Так | Так | Так | Так | Так | Так | Так | Так | Так | Так | Так

## Коротка інформація

CSS | CSS2
Значення за умовчанням | auto
Наслідує | Ні
Застосовується | До усіх елементів
Аналог HTML | Ні
Посилання на специфікацію | http://www.w 3.org/TR/CSS21/visuren.html#propdef - right

### Опис

Для елементу, що позиціонується, визначає відстань від правого краю батьківського елементу, не включаючи відступ, поле і ширину рамки, до правого краю дочірнього елементу (мал. 1). Відлік координат залежить від значення властивості position. Якщо воно рівне absolute, батьком виступає вікно браузеру і положення елементу визначається від його правого краю. У разі значення relative, right відлічується від правого краю початкового положення елементу. Якщо для батьківського елементу задане position: relative, то абсолютне позиціонування дочірніх елементів визначає їх положення від правого краю батька.

Мал. 1. Значення властивості right

### Синтаксис

right: значення | відсотки | auto | inherit

### Значення

Як значення приймаються будь-які одиниці довжини, прийняті в CSS, - наприклад, піксели (px), дюйми (in), пункти (pt) та ін. Значення властивості right може бути і негативним, в цьому випадку можливі накладення різних елементів один на одного. При завданні значення у відсотках, положення елементу обчислюється залежно від ширини батьківського елементу.

auto Не змінює положення елементу.

inherit Наслідує значення батька.

Приклад

HTML 4.0 CSS 2.1 IE 6 IE 7 IE 8 Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http ://www.w 3.org/TR/html4/strict.dtd">

    <html>

      <head>

        <meta http-equiv="Content-Type" content="text/html; charset=windows - 1251">

        <title>right</title>

        <style type="text/css">

          #leftcol {

            position: absolute; /* Абсолютне позиціонування */

            top: 20px; /* Положення від верхнього краю */

            left: 20px; /* Положення від лівого краю */

            width: 100px; /* Ширина блоку */

            background: #fc3; /* Колір фону */

            border: 1px solid #000; /* Параметрів рамки */

            padding: 10px; /* Полів навколо тексту */

          }

          #centercol {

            position: relative; /* Відносне позиціонування */

            background: maroon; /* Колір фону */

            padding: 10px; /* Полів навколо тексту */

            color: white; /* Колір тексту */

            margin: 13px 250px 0 130px; /* Відступів навколо блоку */

          }

          #rightcol {

            position: absolute; /* Абсолютне позиціонування */

            top: 20px; /* Положення від верхнього краю */

            right: 20px; /* Положення від правого краю */

            width: 200px; /* Ширина блоку */

            background: #ccc; /* Колір фону */

            border: 1px solid black; /* Параметрів рамки */

            padding: 10px; /* Полів навколо тексту */

          }

        </style>

      </head>

      <body>

     <div id="leftcol">  Луцький національний </div>

      <div id="centercol">  Луцький національний техніний університет</div>

      <div id="rightcol">Луцький національний техніний університет

    є одним із найкращих професійних закладів освіти у місті Луцьку.

    Найкращою з підготовки спеціалістів є кафедра професійного навчання, що займається професійною підготовкою студентів. </div>

      </body>

    </html>

Результат цього прикладу показаний ні мал. 2.

Мал. 2. Застосування властивості right

### Об'єктна модель

[window.]document.getElementById("elementID").style.right

### Браузери

У браузері Internet Explorer 6 для елементів, що абсолютно позиціонуються, не можна одночасно задати властивості top, left, right, bottom.

Internet Explorer до сьомої версії включно не підтримує значення inherit.