Тег CSS margin-left з прикладом
Тег margin-left встановлює відступ від лівого краю елемента. Цей відступ визначає відстань від зовнішнього краю лівої межі поточного елемента до внутрішньої межі його батьківського елемента.
Синтаксис
margin-left: значення | auto | inherit
Значення
Величину лівого відступу можна вказувати в пікселях (px), відсотках (%) або інших одиницях, дозволених для CSS. Значення може бути як позитивним, так і від'ємним числом.
- auto
- Розраховує розміри відступів автоматично браузером.
- inherit
- Наслідує значення батьківського елемента.
Приклад
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>margin-left</title>
<style>
.layer1 {
background-color: #D36037; /* Цвет фона */
}
.layer2 {
margin-left: 20%; /* Отступ слева */
background-color: #ccc; /* Цвет фона */
padding: 10px; /* Поля вокруг текста */
}
</style>
</head>
<body>
<div class="layer1">
<div class="layer2">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh
euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim
ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl
ut aliquip ex ea commodo consequat.
</div>
</div>
</body>
</html>Результат даного прикладу показано на рис. 2.
Об'єктна модель
[window.]document.getElementById("elementID").style.marginLeft
Браузери
Браузер Internet Explorer 6 подвоює значення лівого або правого відступу для плаваючих елементів, вкладених у батьківські елементи. Проблему можна вирішити додавши display: inline для плаваючого елемента.
Internet Explorer до версії 7.0 не підтримує значення inherit.