Доброго времени суток, коллеги! Проблема наверняка до жути элементарная в решении, но скилл не позволяет определить ответа на вопрос. Задал элементу внутренний отступ, элемент подрос и залез на соседние блоки. Выходит так, что размер блока родителя оставил высоту относительно текстовому содержимому не учитывая его отступы.
Задачу можно решить присваиванием родителю свойство display.
Но в индивидуальном формате решение данной проблемы не подходит, т.к придётся добавлять дополнительные контейнеры перед данным элементом и ему подобных.
Помогите найти универсальное решение проблемы, чтобы была возможность помещать ссылку с классом которому определён внутренний отступ в любое место на странице.
Стиль элемента
a.button
background-color: #ffcb0f
text-transform: uppercase
color: #fff
padding: 0.7rem 1.2rem
border-radius: 8px
font-weight: bold
Ссылки в документе
<div class="links"><a class="button" href="#">Know more</a><a class="button" href="#">Know more</a></div>