What is the difference between Margin and Padding?

   CSS

While writing the CSS, it is always confusing on finding the difference between margin and padding.

To understand the concept, consider a box. When we need to increase the space outside the box, we use margin, if we need to increase the spacing inside of the box then we use padding.

The another big difference is that padding is included in the click region but margin is not.

CSS Example

.content{
    width: 600px;
    height: 300px;
    background: #D1F9FD;
    margin: 20px;
    padding: 10px;
}

Output

Margin Vs Padding
Tags: CSSMarginMargin Vs PaddingPadding

Leave a Comment