JSFiddle - React, Tailwind, and code Playground

by mrjordy

HTML

<div class="nestFooter">
  <ul>
    <li><a target="_blank" href="https://www.navy.mil">US Navy</a></li>
    <li><a target="_blank" href="http://foia.navy.mil/">FOIA</a></li>
    <li><a target="_blank" href="https://www.veteranscrisisline.net/">Suicide Prevention Lifeline</a></li>
    <li><a target="_blank" href="http://prhome.defense.gov/nofear">No Fear Act Data</a></li>
  </ul>
</div>

CSS

.nestFooter {
  text-align: center;
  background: blue;
  height: 50px;
  line-height: 50px;
}

.nestFooter>ul>li {
  display: inline-flex;
  margin: 0 10px;
}

.nestFooter>ul>li>a {
  color: white;
  font-family: kalinga;
  font-size: 16px;
}