Как лучше реализовывать такую кнопку?
Первый вариант:
div {
width: 150px;
text-align: center;
background-color: #fff;
border: 2px solid #ddd;
}
a {
display: inline-block;
padding: 3px 0;
width: inherit;
text-decoration: none;
text-transform: uppercase;
color: red;
}
<div>
<a href="#">load more</a>
</div>
Или же второй вариант:
a {
display: block;
width: 150px;
padding: 3px 0;
text-decoration: none;
text-align: center;
text-transform: uppercase;
color: red;
border: 2px solid #ddd;
<a href="#">load more</a>
<a>
, если это не ссылка... Все зависит от того, что делает кнопка... Если не ссылка, так и тег<a>
не надо использовать...