Why is not allowed inside

Why can’t <p> be nested inside <table>? What is the correction I could make?
Removing the <div> and <p> tags corrupt my design. As the website follows a client provided design.

I have the following code and it works fine in VS2008, but I get warnings:

<div class="right_articles">
    <p>
        <table>
            <tr>
                <td>
                    <img alt="Img not found" src="images/ribbon.gif" style="width: 155px; height: 125px;" />
                </td>
                <td>
                    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
                    <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label><br />
                    <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
                </td>
            </tr>
        </table> 
    </p>
    <p>&nbsp;</p>
    <p>
        <table>
            <tr>
                <td>
                    <img alt="Img not found" src="images/medal.gif" style="width: 155px; height: 125px;" />
                </td>
                <td>          
                    <asp:Label ID="Label4" runat="server" Text="Label"></asp:Label><br />
                    <asp:Label ID="Label5" runat="server" Text="Label"></asp:Label><br />
                    <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>      
                </td>
            </tr>
        </table>
    </p>
</div>

Warning 1 This end tag has no matching start tag.
E:WebSite4test.master 121 Warning 2 Validation (XHTML 1.0
Transitional): Text is not allowed between the opening and closing
tags for element html’. E:WebSite4test.master 5 Warning 3 Validation
(XHTML 1.0 Transitional): Element ‘form’ is missing its closing tag.
E:WebSite4test.master 21 Warning 4 The class or CssClass value is
not defined. E:WebSite4test.master 33 Warning 5 File ‘spacer.gif’
was not found. E:WebSite4test.master 116 Warning 7 Validation (XHTML
1.0 Transitional): Element ‘img’ is missing required attribute ‘alt’. E:WebSite4test.master 116 Warning 8 Validation (XHTML 1.0
Transitional): Element ‘table’ cannot be nested within element ‘p’.
E:WebSite4test.master 78 Warning 9 Validation (XHTML 1.0
Transitional): Element ‘table’ cannot be nested within element ‘p’.
E:WebSite4test.master 93

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

In HTML it’s important to understand that P elements cannot contain other block level elements and TABLE is a block level element. The P closing tag is optional and when you try to make a P element contain something that it cannot contain, the closing P tag is assumed by the browser.

The P element represents a paragraph. It cannot contain block-level
elements (including P itself).

http://www.w3.org/TR/html401/struct/text.html#h-9.3.1

Method 2

In answer to your actual question a paragraph cannot contain any other block elements, which includes tables. Also in addition to this the closing </p> tag is optional so the first closing tag that is subsequently found by the parser will deem to have closed the paragraph.

It would help if I could see more of the code and layout, however I believe that removing the <p> tags from around the tables and then correctly formatting the positioning of your tables using CSS should achieve your results.

<div class="right_articles">
            <table>
            <tr>
            <td>
                <img alt="Img not found" src="images/ribbon.gif"                     
                    style="width: 155px; height: 125px;" />
            </td>
            <td>
                <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
                <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label><br />
                <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
            </td>
            </tr>
            </table>
            <p>&nbsp;</p>
            <table>
            <tr>
            <td>
                <img alt="Img not found" src="images/medal.gif"                     
                    style="width: 155px; height: 125px;" />
            </td>
            <td>          
                <asp:Label ID="Label4" runat="server" Text="Label"></asp:Label><br />
                <asp:Label ID="Label5" runat="server" Text="Label"></asp:Label><br />
                <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>      
            </td>
            </tr>
            </table>
        </div>


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x