Границы элементов

Ну что, не надоело вам еще изучать эти каскадные таблицы стилей? Если нет, то у меня припасено еще кое что интересное.
В прошлых уроках часто упоминалось про различные отступы и даже было показано как они реализуются, но всё это было в скольсь. Я решил заполнить этот пробел в знаниях и сделать отдельный урок по теме отступов и границ элементов.

С начала сразу же разберёмся с отступами, в CSS есть два свойства отвечающих за это:

margin - Задаётся элементам для внешних отступов, имеет значения left (отступ с лева), right(с права), top(с верху), bottom(с низу), в основном расстояние задаётся в пикселях, но например чтобы выровнять элемент по центру, не обязательно отщитывать для этого оптимальное расстояние в пикселях от какого нибудь края, можно всего лишь прописать атрибут margin:auto; тогда объект выровняется строго по центру, в общем принцип вы поняли.

padding - Это в отличии от марджина, уже отступ внутренний, то есть от внутренней границы элемента, параметры все те же самые что и у марджина. Ну вот с отступами мы и закончили.

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

#ramka {border:1px solid #000000; width:80%; margin:0 auto 0 auto;} - Здесь я айди с названием ramka, задал рамку, толщиной в один пиксель, сплошную и чёрную, ширина задана в 80 процентов, выровнен этот элемент с айди ramka по центру.

Да ничего тут в общем то сложного то и нет, тут можно и самим разобраться. Но для более глубокого усвоения можете посмотреть мой видеоурок: