Web Design Web Design | Page 12

CSS - Margin, Border si Padding

CSS - incadrarea continutului.

Folosind CSS putem incadra contiunutul, putem stabilii distanta intre continut si border intre border si marginea paginii. Vom folosi urmatoarele atribute:

margin - distanta intre border si marginea paginii

border - marginea si cutia care incadreaza continutul

>padding - distanta intr border si continut

content - continutul propriu-zis (text, imagini, etc)

Vom aplica atributele de mai sus sub forma:

div {

width:200px;

padding:15px;

border:5px solid;

margin:15px;

}

Observatie:

Vom considera exemplul de mai sus un element. Trebuie mentionat ca acest element are o latime totala de 270px (200+15x2+5x2+15x2=270px).

Concluzie:

latimea continutului + left padding + right padding + left border + right border + left margin + right margin = Latimea totala

si

inaltimea continutului + left padding + right padding + left border + right border + left margin + right margin = Inaltimea totala

Aceste doua formule trebuiesc luate in considerare atunci cand stabilim inaltimea si latimea continutului.