Centering a Text Inside a Button That Works with Outlook
I'm looking to center a text inside a button and do so consistently across all platforms. My problem is that the centered text doesn't always show up in all versions of Outlook. Currently, I've been able to center a button and figured I can use the same mentality. So I did the button this way:
<center> <button class="small-expanded text-center" href="#")">Text</button> </center>
This was doable and I was able to get the text centered inside the button, but only in certain versions of Outlook. So I tried it with this next code and I got the text to be centered on all versions of Outlook.
<center> <button class="small-expanded text-center" href="#")"><center>Text</center></button> </center>
The caveat here is that by adding another <center> inside the button, it caused more padding/margin to be added surrounding the text, which then increased the text padding more on certain Outlook versions.
I also added inline styles to the second center, so it's something like this:
<center style='display:block; text-align:center!important; margin:0; padding:0;'>Text</center>
I'm probably missing something here, but is there a way to center the text without inflating the padding inside the element?