I use an untypical image background inside a button. I need to make this text appear "higher" inside the button than the default (which is vertically centered). What I have to do?
CSS:
.button {
width: 211px;
height: 66px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
text-transform: uppercase;
color: white;
background: url('../img/button.png') no-repeat;
border: none;
cursor: pointer;
}
HTML:
<input type="submit" class="button" value="Submit"/>
(...)
<button class="button">Get a quote</button>
Screen from browser:
As you can see texts in buttons should be little bit higher then it is now
Set the padding-bottom
.
button{
width: 300px;
height: 300px;
padding-bottom: 200px;
}
The demo.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With