Why doesn't a LinkButton work with a table as it's content?

Question

Using ASP.NET 3.5, you can create a LinkButton then define content inside of it. It works fine if I have div tags or any kind of text or anything, but if I use a table the click doesn't actually post back for some reason. This should take you to google (you'll get an error there but it should still go) for instance:

<asp:LinkButton ID="lbTest" PostBackUrl="http://www.google.com" runat="server">
            <table>
                <tr>
                    <td>Test</td>
                    <td>col2</td>
                    <td>col3</td>
                </tr>
            </table>
        </asp:LinkButton>

I could work around it by building a "table" with divs I guess, but I hate formatting with divs.

Answer 1

I'm pretty sure you can't do this with a table.

Answer 2

You can't do what you are trying to do because the table tag will not let the a tags be clickable even though they look like they are. I don't think this is a valid use of the a tag.

You can get around this my adding a client side onclick to the table and then manually do the redirect using javascript.

Also, why are you using a LinkButton versus a regular a tag? I assume you want to link back to something in your app. If so you will need to generate the __DoPostBack call as well in your javascript to mimic the LinkButton behavior. To do so use the following code to generate the correct javascript:

string javascriptToDoPostBack = Page.GetPostBackEventReference(yourLinkButton); 

Answer 3

The table is a block element, and the link is an inline element, so you can't put a table in a link.

The browser will try to correct the structure, probably by moving the table outside the link, so what you get is a table that is not linked, and a link without content.

If you want to put elements inside the link, they have to be inline elements, e.g. span tags. You can then use CSS to turn both the link and the elements inside it into block elements, but the structure has to make sense both before and after the CSS is applied.