Vertical Alignment not working CSS HTML [duplicate]

This question already has an answer here:

• How do I vertically center text with CSS? 30 answers

I have been looking for tutorials how to center text in link. Nothing helped. Could you help me out? HTML:

<nav>

        <a class="but1" href="#"><strong>ART</strong></a>
        <a class="but2" href="#"><strong>VIDEOS</strong></a>
        <a class="but3" href="#"><strong>ABOUT</strong></a>
        <a class="but4" href="#"><strong>CONTACT</strong></a>

</nav>

CSS:

nav a {
    font-size: 500%;
    text-decoration: none;
    color: white;
    Height: 25%;
    width: 100%;
    position:absolute;
    text-align: center;
    vertical-align: middle;
    transform: translate(-50%, -100%);
    left: 50%;
    }

.but1 {
    background-color: #e24e42;
    top: 25%;
    }


.but2 {
    background-color: #e9b000;
    top: 50%;
}

.but3 {
    background-color: #eb6e80;
    top: 75%;
}

.but4 {
    background-color: #008f95;
    top: 100%;
}

I am starter in Web development. To be exact 2 days. If there are HUGE Mistakes, don't judge me.