what is difference b/w padding and margin.

It has everything to do with the box model: https://css-tricks.com/the-css-box-model/

Padding will grow the element's size itself, margin will create space around the element. It more or less goes content > padding > border > margin.

That link will explain it better.

If you have a border, padding will be on the inside of the border, margin will be on the outside of the border. Padding is like expanding your element itself. Margin is giving more space between the element and its neighbor. If you click inside the padding, you're clicking the element. So if I give my button a lot of padding, I have a nice big fat clickable button. If you click the margin, you're clicking the background behind it.