HTML
<h1 class="f4 bold center mw5">Cats</h1>
<ul class="list pl0 ml0 center mw5 ba b--light-silver br3">
<li class="ph3 pv2 bb b--light-silver">Mackeral Tabby</li>
<li class="ph3 pv2 bb b--light-silver">Burmese</li>
<li class="ph3 pv2 bb b--light-silver">Maine Coon</li>
<li class="ph3 pv2 bb b--light-silver">Orange Tabby</li>
<li class="ph3 pv2 bb b--light-silver">Siamese</li>
<li class="ph3 pv2 bb b--light-silver">Scottish Fold</li>
<li class="ph3 pv2">American Bobtail</li>
</ul>
css
.ba {
border-style: solid;
border-width: 1px;
}
.bb {
border-bottom-style: solid;
border-bottom-width: 1px;
}
.b--light-silver {
border-color: #aaa;
}
.br3 {
border-radius: .5rem;
}
.list {
list-style-type: none;
}
.mw5 {
max-width: 16rem;
}
.pl0 {
padding-left: 0;
}
.pv2 {
padding-top: .5rem;
padding-bottom: .5rem;
}
.ph3 {
padding-left: 1rem;
padding-right: 1rem;
}
.ml0 {
margin-left: 0;
}
.f4 {
font-size: 1.25rem;
}
.center {
margin-right: auto;
margin-left: auto;
}