How to vertical align text within a button...

[CourtneyOliver]

I am working with buttons for the first time and I've managed to create a grid that is responsive to screen size and has horizontally aligned text.  What I can't figure out is how to center my text vertically.  I know the padding is keeping it anchored (and pushing my long text off the bottom of the button) but I don't know what to replace that with to vertically align the text.  Any help is appreciated.

Here is a snippet of my code:

<p>&nbsp;</p>
<div class="content-box">
<div class="grid-row">

<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12" style="padding: 5;">
<div class="btn" style="background: #033759; border: none; height: 75px; margin: 5px; text-align: center;"><a style="position: relative; padding: 30px 0; height: 70px; display: block; text-decoration: none;" title="..." href="..."> <span style="color: #ecf0f1;">A really long button title that is going to flow onto more than one line </span> </a></div>
</div>

[gnoack]

Hi @CourtneyOliver 

Try adding, 

vertical-align="bottom" 

 I was able to get it to work. 

Found the code from, https://bfo.com/products/report/docs/tags/atts/vertical-align.html

<p>&nbsp;</p>
<div class="content-box">
<div class="grid-row">
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12" style="padding: 5;">
<div class="btn" style="background: #033759; border: none; height: 75px; margin: 5px; text-align: center;"><a style="position: relative; padding: 30px 0;" title="..." href="..."> <span style="color: #ecf0f1;">A really long button title that is going to flow onto more than one line </span> </a></div>
</div>
</div>
</div>

[CourtneyOliver]

Unfortunately, it didn't work for me; nothing moved when I added the new code.