Помощник
 |
|
|
|
|
Сообщение сайта
|
 margin vs position или что лучше margin или position? |
AndreySmith
|
Сообщение
#1
|
||
 0  Группа: User Сообщений: 544 Регистрация: 31.7.2009 Поблагодарили: 0 раз Репутация:  0 
 |
|
||
 |
|
||
|
alexdrob
|
 11.10.2009, 12:49;
Ответить: alexdrob
Сообщение
#2
|
|
0 
 Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация: 0
|
Разница большая.
например <div id="d1"> <div id="d2"></div> </div> если задать диву d2 абсольтное позицианирование то он уже не будет вложен в d1 а будет вложен в контейнер в котором он находится и тот кантейнер имеет positioh: absolute или relative если такого контейнера нет то он будет позицианироватся относительно всей стринице точнее блока <html></html> position: relative; часто используют чтобы указать что это контейнер является Родителем для всех вложенных в него контейнеров. то есть <div id="d1" style="position:relative;"> <div id="d2"> <div id="d3" style="position:absolute;top:3px"></div> </div> </div> здесь relative использованно только для того чтобы показать d3 что нужно позицианироватся относительно d1 из d2 d3 выпадает. то есть если бэкграунд у д2 будет например красный а у д1 будет синий то текст контейнера д3 будет на синем фоне. разница между padding И margin тоже очень большая если задать элементу ширину и высату то это облость будет для текста теперь представь надо сделать блок с фоном зелёного цвета и написать в нём текст <div style="background-color:#00ff00;height:20px;width:100px;">Текст</div> <div style="background-color:#00ff00;height:20px;width:100px;">Текст</div> если разместить подрят 2 блока то они сольются если задать блоку: margin: 5px; например то болк растянется в каждую сторону на 5 пикселей но фоновая картинка или цвет не зальёт это место и получится отступ. а вот если задать блоку: padding:5px; то блок тоже растянется во все стороны на 5 пикселей но это место будет залито зелёным цветом а отступа между блоками не будет. если задать border блоку то будет видно что заливка идёт до бордера отступ от содержимого блока до бордера - padding а отступ от бордера до следующего блока - margin |
|
|
|
|
AndreySmith
|
Сообщение
#3
|
|
|
0 Группа: User Сообщений: 544 Регистрация: 31.7.2009 Поблагодарили: 0 раз Репутация: 0
|
Ого))) Тут чуток подредактировать и целая статья))) Спасибо, узнал кое-что новое, положил в копилку;)
У меня была ситуация, когда мне нужно было разместить меню сделанное из двух блоков, а в каждом блоке по 4 пункта меню. С помощью position:relative/absolute; у меня получалось разместить меню по центру, но когда окно браузера уменьшал блоки меню смещались, при том что min width было указано. Т.е. фоновый хедер на месте а меню съезжает. Решил проблему с помощью margin, указав в процентах отступы от левого края. Меню закрепилось на одном месте при разных размерах окна браузера (ну и разрешениях монитора):droch: Тут как мне кажется кроется очень важное отличие. Ну, а при прочих равных условия, когда мне в принципе все равно что использовать margin или position-ы, ибо работает и то и другое, что лучше выбирать? Может что-то надежнее работает или меньше требует времени для обработки?
|
|
|
|
|
|
|
|
Похожие темы
| Тема | Ответов | Автор | Просмотров | Последний ответ | |
|---|---|---|---|---|---|
 |
Создать видеоканал лучше в ютуб или телеграм? | 20 | uahomka | 3516 | 20.4.2024, 20:56 автор: Vmir |
 |
 Во что Вы играете? |
400 | Vmir | 67917 | 20.4.2024, 18:39 автор: SaintExchange |
|
Во что сегодня инвестировать? Делимся своими приносящими прибыль вариантами |
76 | traveliver | 5056 | 20.4.2024, 18:27 автор: SaintExchange |
|
Если статья не в индексе Google - она уникальна или нет? | 5 | uahomka | 1440 | 3.4.2024, 23:56 автор: Liudmila |
|
Где больше пробив на кликандер или попандер или попап трафике? | 1 | Boymaster | 679 | 20.3.2024, 9:50 автор: Skyworker |
|
Текстовая версия | Сейчас: 23.4.2024, 11:00 |
