how to underline the access key in an input button

Question

I have a button and I would like to underline the access key letter, <u></u> doesn't work, and C̲ (C̲) changes the font, it should be verdana

    <input class="boton" type="button" value="C&#818;ancel" accesskey="C" onclick="cancel();"/>

In my css I put the font type:

input.boton{

font: bold 11px verdana !important;
color: #000;

 }

How can I do this?

Answer 1

There's no HTML entity you can apply that would render an underline. Inside a value attribute you cannot use other HTML tags, so you can't render an underline this way. Using a Unicode combining low line may result in differently rendered fonts, as you notice, since you're generating a new character which your primary font may have issues rendering.

Therefore the best solution may be to use a button, which allows arbitrary HTML content:

<button ...>C<u>a</u>ncel</button>