Свойства внешнего отступа

Свойство margin определяет внешний отступ для элемента по четырем сторонам: вверху, внизу, слева и справа. При этом он может быть задан по частям, используя свойства margin-top, margin-bottom, margin-left и margin-right. Существует также сокращенная запись внешних отступов по сторонам. Рассмотрим несколько примеров:

Внешний отступ

margin: 10px;

margin-top: 10px;

margin: 10px 20px 30px 40px;

margin: 10px 20px 30px;

margin: 10px 20px;

Первая запись в примере определяет внешний отступ, равный 10 пикселям по всем четырем сторонам элемента. Вторая запись определяет внешний отступ сверху, равный 10 пикселям. Следующая запись определяет отступ сверху 10 пикселей, справа – 20 пикселей, внизу – 30 пикселей, слева – 40 пикселей. В сокращенной записи отступа направления перечисляются начиная сверху и далее по часовой стрелке, т.е. справа, внизу и слева. В случае, когда отступ задан не для всех сторон, например как в четвертой и пятой записи, недостающие величины будут равны соответствующим величинам симметричных сторон. Так, в соответствии с четвертой записью, будет установлен внешний отступ сверху, равный 10 пикселям, слева и справа – 20 пикселей, внизу – 30 пикселей. Последняя запись предполагает отступ сверху и снизу по 10 пикселей, слева и справа – по 20 пикселей.