<style type="text/css">
.mystyle1 {
padding: 5px;
border: 3px solid green;
width: 20em;
margin: 1em}

.mystyle2 {
padding: 2%;
border: 3px solid red;
width: 20em;
margin: 1em}

.mystyle3 {
padding: 1ex;
border: 3px solid purple;
width: 20em;
margin: 1em }
</style>
.....
<h3>5px Padding between text and border</h3>
<div class="mystyle1">Fixed distance between text and border</div>

<h3>2 Percent Padding between text and borders</h3>
<div class="mystyle2">Distance between text and border dependent on widow width</div>

<h3>1 ex Padding between text and borders</h3>
<div class="mystyle3">Distance between text and border dependent on font size</div>
....