<h2><code>padding: 10px;</code></h2>
<div class="ap"></div>
<h2><code>padding: 2em 4em;</code></h2>
<div class="bp"></div>
<h2><code>padding: 1em 20px 2em;</code></h2>
<div class="cp"></div>
<h2><code>padding: 10px 10% 2em 15%;</code></h2>
<div class="dp"></div>

* {
  box-sizing: content-box;
}

body {
  font-family: Lato;
  margin: 10px;
  font-size: 1.4em;
}

h2 {
  font-size: 1.1em;
  margin-left: 2em;
}

div {
  background: orange;
  background-clip: content-box;
  height: 80px;
  width: 80px;
  margin: 2em;
  margin-top: 0em;
  border: 1px solid black;
}

.ap {
  padding: 10px;
}

.bp {
  padding: 2em 4em;
}

.cp {
  padding: 1em 20px 2em; 
}

.dp {
  padding: 10px 10% 2em 15%;
}