Margin and Padding

Shorthand writing

Vertical and horizontal values

div {
  margin: 20px 50px;
  /* is same as */
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 50px;
  margin-right: 50px;
}

Vertical and horizontal values

div {
  padding: 25px 50px 75px;
  /* is same as */
  padding-top: 25px;
  padding-bottom: 75px;
  padding-left: 50px;
  padding-right: 50px;
}

All values

div {
  padding: 25px 50px 75px 100px;
  /* is same as */
  padding-top: 25px;
  padding-right: 50px;
  padding-bottom: 75px;
  padding-left: 100px;
}

css