Вот мой HTML:
Код: Выделить всё
[url=#bottomPage]Go to Bottom ->[/url]
[url=order.html]Order Coffee Now![/url]
[url=#title]Back to Top ^[/url]
Код: Выделить всё
a {
background-color : #483c32;
border-radius : 5px;
color : white;
font-size : 15px;
position : relative;
cursor : pointer;
padding : 5px 5px;
position : relative;
}
a:hover {
background : rgba(72, 60, 50, 0.8);
transition : 0.5s;
}
button {
border : none;
background : none;
cursor : pointer;
padding-bottom : 15px;
text-decoration : none;
position : relative;
}
Go to bottom button:

,
Order coffee button:

,
Back to top button:

I tried doing this
Код: Выделить всё
button{
border : none;
background : none;
cursor : pointer;
padding-bottom : 15px;
text-decoration : none;
position : relative;
background-color : #483c32;
border-radius : 5px;
color : white;
font-size : 15px;
position : relative;
cursor : pointer;
padding : 5px 5px;
position : relative;
display : none;
margin : 0 auto;
}

As you can see, the CSS of the a element tag still remains. I want to center the button without creating any wrappers (I am restricted from tampering with the HTML files lol) and without inheriting the design of the a element tag.
Источник: https://stackoverflow.com/questions/781 ... l-wrappers
Мобильная версия