Archived topic
How do I add full width button with centered text and inherits Theme color
6 replies · Started by Hemant on July 27, 2020
Is there a way I can add full width button that inherits theme color but with bold and large text?
I wish to add a button that says continue with a hyperlink to other page.
The page in question is: https://pressbuzzer.com/celebrities-who-died-too-soon/3
There already exists a continue button but I would like to achieve it through themes color... I want the text size to be large and centered...
Thanks David, So I have this CSS:
.button.sun-flower,
.button.sun-flower:visited {
background: #F1C40F;
color:#FFF;
}
.button.large {
font-size: 35px;
}
a.button.wide {
width: 100%;
}
And this is the HTML Code:
<a class="button sun-flower large wide" href="URL FOR YOUR BUTTON">Your button text</a>
It works well.. but how to I center the text?
I managed to get it work via this..
<center><a class="button sun-flower large wide" href="URL FOR YOUR BUTTON">Your button text</a></center>
but the button is slightly tilted towards right... how do i make it center... check it on mobile..
Change this CSS:
a.button.wide {
width: 100%;
}
to:
a.button.wide {
width: 100%;
box-sizing: border-box;
text-align: center;
}
You are a genius.. that worked.. :)
You're welcome