The CSS box model refers to the design of html in which a box wraps around html elements.
Padding is there to clear an area within the border while margin clears and area outside the border.
For the width you take into consideration the side paddings and the side borders and margins while for the height you take into account the top and bottom paddings, borders, and margins.
This is the shorthand version of padding and its basically saying that the top and bottom will be 25px and the sides will be 50px.
The Outline is not affected by the elements size while the border is, also the outline goes outside the border.