Относительное позиционирование с помощью css

17 Апр 2011, рубрика: Верстка, Обзоры |

Недавно столкнулся с вопросом, как с помощью css разместить один элемент относительно другого, причем он должен быть как бы “над ним”. Ясное дело, задание конкретных значений left и top, и свойства в position в “absolute” не помогут, так как на разных разрешениях экрана результат будет выглядеть по-разному.
Вообще, позиционирование в css – довольно простая штука, но некоторые “фичи” все же надо знать…

Я буду время от времени выкладывать такие полезные штуки. Для новичков, я думаю это будет очень к стати.

Относительное позиционирование с помощью css.

Относительное позиционирование с помощью css

<div id = “Polezniy”>
<div id = “SomeDiv”>
</div>
</div>

Допустим, у нас есть элемент с id = “Polezniy”. Нам нужно, чтобы какой-то элемент размещался поверх него, скажем, 120 пикселов от левого края. Для этого элементу с id = “Polezniy” нужно задать css свойство position равным relative.

div#Polezniy{
/*…*/
position:relative;
/*…*/
} 

Теперь положение всех элементов, которые расположены “внутри” этого будет отсчитываться относительно его границ. Теперь все что нам нужно:

div#SomeDiv{
/*…*/
position:absolute;
left:120px;
/*…*/
} 

Мы поставили этому div-у postion, равное absolute и установили значение left равным 120px. Благодаря тому, что у «родительского» контейнера свойство position равным relative, наше значение left будет отсчитіватся от левого края контейнера с id = «Polezniy».
Продвижение ваших сайтов особенно продвижение сайтов санкт-петербург становиться более быстрым и менее затратным. Вам помогут лучшие специалисты в своей области, что позволит вам получить неплохой заработок.
Вот и все =) надеюсь, для вас это было полезно.




Оцените полезность!
Не полезноПолезно (+1 баллов, 1 оценок)

Один комментарий на «Относительное позиционирование с помощью css»

  1. Относительное позиционирование с помощью css | Социальная сеть для вебмастеров пишет:

    [...] Недавно столкнулся с вопросом, как с помощью css разместить один элемент относительно другого, причем он должен быть как бы “над ним”. Ясное дело, задание конкретных значений left и top, и свойства в position в “absolute” не помогут, так как на разных разрешениях экрана результат будет выглядеть по-разному. Вообще, позиционирование в css – довольно простая штука, но некоторые “фичи” все же надо знать… Я буду время от времени выкладывать такие полезные штуки. Для новичков, я думаю это будет очень к стати. Читать полностью [...]

Ваш отзыв

.Все права защищены © 2017 Блог Полезного.