Text alignment isn't working the way it's intended, is there any other way to do it?

Question

I'm really new to using both HTML and CSS, so any advice is welcome. I've been running into some problems with two hyperlinks sharing the same class which are both supposed to pose as buttons.

Right now I'm trying to make the text inside both buttons align in the center of their respective backgrounds but align-text: center doesn't work and most other responses I have found have been too complicated for a starter like me to comprehend (trust me, if at least I knew where to place those eldritch scribings I'd at least test what the results end up being). Also, for some reason flex-direction doesn't seem to work so the solution I could find is use display: inline-flex instead of diplay: flex.

Up to this point I tried using:

HTML:

<a class="presentation__content__links" href="linktothewebsite.com"> Yada yada </a>

CSS:

.presentation__content__links: { 
    display: inline-flex; 
    text-align: center; 
}

I also tried this:

HTML

<div class="presentation__content__links">
    <a class="presentation__content__links__link" href="linktothewebsite.com"> Yada yada </a>
</div>

CSS:

.presentation__content__links: { 
    text-align: center; 
}

.presentation__content__links__link { 
    display: inline-flex; 
    text-aling: center; 
 }

Because I read it could align the child with the parent and by that point I was already kind of desperate. If it's a necessity I can post the entirety of the code while censoring the hyperlinks, it's just short of 120 lines.

Answer 1

You can try this

.presentation__content__links__link{ 
   display: inline-flex;
   justify-content: center
 }

Hope it will work for you

Answer 2

 .presentation__content__links{ 
display: flex; 
**justify**-content: center; 

} /you just need to justify content centre . Justify content centre makes the content align in the centre along the horizontal path./