Remove Text Padding/Margin inside VML Shape

Question

I'm trying to figure out how to get this text (!) to show up. Even though it's smaller than the circle it's in, it still gets cut off about 1/3 of the way in to the circle.

I would like to use this for Outlook specifically.

<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" style="height:20px;v-text-anchor:middle;width:20px;" arcsize="50%" stroke="f" fillcolor="#ffcb05">
    <center style="color:#ffffff;font-family:sans-serif;font-size:16px;font-weight:bold;">!</center>
</v:roundrect>

Anyone have any ideas? I've tried overflow:visible on the circle to no avail.

More information

Using a macro to get test html into Outlook.

It is most definitely some sort of margin or padding on the v:roundrect element. After importing the HTML, I can right click, go to Format Shape, then Layout & Properties, which gives me the 4 "margin" options. Setting them to zero gives me the desired effect. The issue is that I cannot then grab this HTML, and I have no idea what property this is correlating to.

Latest code:

<v:roundrect style="height:30px;width:30px;margin:0 !important;padding:0 !important; mso-margin-bottom-alt:0 !important;mso-margin-top-alt:0 !important;mso-margin-right-alt:0 !important;mso-margin-left-alt:0 !important;mso-padding-bottom-alt:0 !important;mso-padding-top-alt:0 !important;mso-padding-right-alt:0 !important;mso-padding-left-alt:0 !important;" arcsize="50%" strokeweight="2px" strokecolor="#FFFFFF" fillcolor="#ffcb05" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word">
    <center style="color:#ffffff;font-family:sans-serif;font-size:16px;font-weight:bold;margin:0 !important;padding:0 !important;mso-margin-bottom-alt:0 !important;mso-margin-top-alt:0 !important;mso-margin-right-alt:0 !important;mso-margin-left-alt:0 !important;mso-padding-bottom-alt:0 !important;mso-padding-top-alt:0 !important;mso-padding-right-alt:0 !important;mso-padding-left-alt:0 !important;">!</center>
</v:roundrect>

I've attempted using different elements (span, p, etc..) instead of center.

Answer 1

Textbox with zeroed inset is the key. I had tried it before, but without nested html. Text directly input in the v:textbox element does not appear to work, so I used a center element to encapsulate text and set styles.

<v:roundrect style="height:20px;width:20px;" arcsize="50%" strokeweight="2px" strokecolor="#FFFFFF" fillcolor="#ffcb05" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word">
    <v:textbox inset="0,0,0,0">
        <center style="font:300 14px/15px Impact, Sans-serif;color:#FFFFFF;mso-line-height-rule:exactly;">!</center>
    </v:textbox>
</v:roundrect>

Answer 2

It might help to solve your problem: https://buttons.cm/