Как сделать, чтобы размер ссылки НЕ зависел от кол-ва текста внутри?

Все привет. Столкнулся с такой проблемой - не получается сделать так, размер оформленной мной ссылки не зависел от количества букв внутри. Я новичок, не уверен, правильное решение я сделал, оформляя эти элемента (скрин) именно через ссылки.

<ul class="nav">

            <a class="categories-link1" href="Python.php">Начинающие</a>
            <a class="categories-link2" href="">Начинающие</a>
            <a class="categories-link3" href="">Начинающие</a>

            <a class="categories-link4" href="">Начинающие</a>
            <a class="categories-link5" href="">Начинающие</a>
            <a class="categories-link6" href="">Начинающие</a>
</ul>

.categories {

    &-link1 {
        margin-left: 60px;
        display: inline-block;
        background-color: #3cba6c;
        text-decoration: none;
        color: white;
        font-size: 24px;
        padding: 100px 100px;
        transition: all 1s;
        border-radius: 20px;

        &:hover {
            color: white;
            transition: all 0.4s;
            border-radius: 40px;
            box-shadow:0px 0px 55px 10px rgba(75, 216, 128, 0.78);
            padding: 90px 90px;
        }

    }
}

Пример что нужно исправить. размер этого"блока" зависит от кол-ва текста.


Ответы (0 шт):