Se non sai qual è la differenza tra padding e margini, non sei da solo. È una domanda frequente e ha messo in crisi molti web designer. Con questo breve tutorial, impara a distinguere tra i due.
Capire la differenza
Margini e padding possono confondere il novizio Web designer e talvolta anche i designer con più esperienza. Dopotutto, in qualche modo, sembrano la stessa cosa: lo spazio bianco attorno ad un'immagine o ad un oggetto.
Il riempimento è semplicemente lo spazio all'interno del bordo tra il bordo e l'immagine reale o il contenuto della cella. Nell'immagine, il riempimento è l'area gialla attorno al contenuto. Si noti che il riempimento si estende completamente attorno al contenuto. Troverai imbottitura sui lati superiore, inferiore, destro e sinistro.
D'altra parte, i margini sono gli spazi al di fuori del bordo, tra il bordo e gli altri elementi accanto a questo oggetto. Nell'immagine, il margine è l'area wite al di fuori dell'intero oggetto. Nota che, come il padding, il margine si estende completamente attorno al contenuto. Ci sono margini in alto, in basso, a destra ea sinistra.
Consigli utili
Tieni presente che se hai intenzione di fare cose davvero fantasiose con margini e padding, alcuni browser, come Internet Explorer, non implementano correttamente il modello di box. Ciò significa che le tue pagine appariranno diverse (e talvolta molto diverse) in altri browser.