Pls help i'm stuck

Pls help i’m stuck
The button is glitched
Screenshot 2022-06-11 121919
Html Code:

<a href="1-Poverty.html">
            <ul class="nav-list">
              <li class="btn"><a href="#">More Info</a></li>
            </ul>
          </a>

Css Code:

.about .main .about-text .nav-list li.btn a{
    color: #1e56a3;
    background: transparent;
    border: 2px solid #1e56a3;
    width: auto;
    height: 1.1;
    line-height: 1.1;
}

.about .main .about-text .nav-list li.btn:hover a{
    color: #ffe299;
    background: #1e56a3;
    border: 2px solid #1e56a3;
    transition: .3s;   
}

.about .main .about-text .nav-list{
    list-style: none;
}

In what way?

Please don’t show pictures of code. Cut and paste code. If it is too much to cut and paste, then please provide a repo or a link to an online IDE.