Question

This code is working fine in IE and Chrome, except firefox..i have scratching my hair to adjust the fieldset in IE and chrome, but at the end i found out the “TRY ME” has run out
of the position which was very different in IE and Chrome.. any solution for this?

css

fieldset 
{
margin: 0 0 1em 0;
width:490px;
border: 5px solid Black;
}

html

<fieldset>
<legend>
    <h2>
     TRY ME
    </h2>
</legend> 

Answer 1

legend elements are notoriously bad to style cross browser.

My best recommendation is to use the h2 outside of legend, and perhaps use legend as well, but hide it from view (text-indent: -9999px) (screen readers should still be able to access its semantic goodness).