Button inside of anchor link works in Firefox but not in Internet Explorer?

Question

Everything else in my site seems to be compatible with all browsers except for my links. They appear on the page, but they do not work. My code for the links are as follows-

<td bgcolor="#ffffff" height="370" valign="top" width="165">
    <p>
        <a href="sc3.html">
            <button style="width:120;height:25">Super Chem #3</button>
        </a> 
        <a href="91hollywood.html">
            <button style="width:120;height:25">91 Hollywood</button>
        </a> 
        <a href="sbubba.html">
            <button style="width:120;height:25">Super Bubba</button>
        </a> 
        <a href="afgoohash.html">
            <button style="width:120;height:25">Afgoo Hash</button>
        </a> 
        <a href="superjack.html">
            <button style="width:120;height:25">Super Jack</button>
        </a> 
        <a href="sog.html">
            <button style="width:120;height:25">Sugar OG</button>
        </a> 
        <a href="91pk91.html">
            <button style="width:120;height:25">91 x PK</button>
        </a> 
        <a href="jedi1.html">
            <button style="width:120;height:25">Jedi</button>
        </a>
    </p>
    <p>&nbsp;</p>
    <a href="http://indynile99.blogspot.com">
        <button style="width:120;height:25">Blog</button>
    </a>
    <p>&nbsp;</p>
</td>

Answer 1

You can't have a <button> inside an <a> element. As W3's content model description for the <a> element states:

"there must be no interactive content descendant."

(a <button> is considered interactive content)

To get the effect you're looking for, you can ditch the <a> tags and add a simple event handler to each button which navigates the browser to the desired location, e.g.

<input type="button" value="stackoverflow.com" onClick="javascript:location.href = 'http://stackoverflow.com';" />

Please consider not doing this, however; there's a reason regular links work as they do:

• Users can instantly recognize links and understand that they navigate to other pages
• Search engines can identify them as links and follow them
• Screen readers can identify them as links and advise their users appropriately

You also add a completely unnecessary requirement to have JavaScript enabled just to perform a basic navigation; this is such a fundamental aspect of the web that I would consider such a dependency as unacceptable.

You can style your links, if desired, using a background image or background color, border and other techniques, so that they look like buttons, but under the covers, they should be ordinary links.