简体   繁体   中英

Stray end tag “tr” and 1 column wide errors

Just starting some HTML5 scripting for my assignment at school. I'm done writing it, however I am encountering 2 errors when submitting my file to http://validator.w3.org/

  1. A table row was 1 columns wide, which is less than the column count established by the first row (6).
  2. Stray end tag tr.

I also have another error for the border of my table, but my prof said to ignore that error. I am trying to produce the following: https://postimg.org/image/ruv1y0vb1/

I can't seem to figure out what the problem is.

Here is my code:

<!DOCTYPE html>
<html lang = "en">
    <head>
        <title> Assignment 1: Question 2 </title>
        <meta charset = "utf-8">
    </head>
    <body>
        <h3> Assignment #1/Question 2 </h3>
        <table border = "1">
            <tr>
                <td colspan = "6"> <h1> Some Canadian Provinces </h1> </td>
            </tr>
            <tr>
                <td rowspan = "7"> 
                    <img src = "https://upload.wikimedia.org/wikipedia/en/thumb/c/cf/Flag_of_Canada.svg/1280px-Flag_of_Canada.svg.png"
                        alt = "Canadian Flag" width = "200" height = "100">
                </td>
            </tr>
            <tr>
                <th> Province </th>
                <td> Quebec </td>
                <td> Ontario </td>
                <td> British Columbia </td>
                <td> Alberta </td>
            </tr>
            <tr>
                <th> Flag </th>
                <td> 
                    <img src = "https://upload.wikimedia.org/wikipedia/commons/thumb/5/5f/Flag_of_Quebec.svg/600px-Flag_of_Quebec.svg.png"
                            alt = "Quebec Flag" width = "100" height = "55">
                </td>
                <td> 
                    <img src = "https://upload.wikimedia.org/wikipedia/commons/thumb/8/88/Flag_of_Ontario.svg/1280px-Flag_of_Ontario.svg.png"
                            alt = "Ontario Flag" width = "100" height = "55">
                </td>
                <td> 
                    <img src = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b8/Flag_of_British_Columbia.svg/600px-Flag_of_British_Columbia.svg.png"
                            alt = "British Columbia Flag" width = "110" height = "55">
                </td>
                <td> 
                    <img src = "https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Flag_of_Alberta.svg/1000px-Flag_of_Alberta.svg.png"
                            alt = "Alberta Flag" width = "100" height = "55" >
                </td>
            </tr>
            <tr>
                <th> Capital </th>
                <td> Quebec City </td>
                <td> Toronto </td>
                <td> Victoria </td>
                <td> Edmonton </td>
            </tr>
            <tr>
                <th> Postal Abbreviation </th>
                <td> QC </td>
                <td> ON </td>
                <td> BC </td>
                <td> AB </td>
            </tr>
            <tr>
                <th> Year Entered<br/>Confederation </th>
                <td> 1867 </td>
                <td> 1867 </td>
                <td> 1871 </td>
                <td> 1905 </td>
            </tr>
            <tr>
                <td colspan = "5"> <strong>References and flags: </strong>
                    <a href = "https://en.wikipedia.org/wiki/Quebec"> Quebec</a> &nbsp;
                    <a href = "https://en.wikipedia.org/wiki/Ontario"> Ontario</a> &nbsp;
                    <a href = "https://en.wikipedia.org/wiki/British_Columbia"> British Columbia</a> &nbsp;
                    <a href = "https://en.wikipedia.org/wiki/Alberta"> Alberta</a>
                </td>
            </tr>
        </table>
    </body>
</html>

You only have one element, but looking at your indentation there are two nested levels of . Fix the indentation and the stray will make itself obvious.

Some comments based on the code you posted: You have mixed up tr and td tags. You need to create another table inside the td tag and then have the rest of the code inside that tag. Never mix tags.

 <table border = "1"> <tr> <td colspan = "6"> <h1> Some Canadian Provinces </h1> </td> </tr> <tr> <td rowspan = "7"> </td> <!--You need to create a td tag here and add another table --> <td> <table> <tr> <th> Province </th> <td> Quebec </td> <td> Ontario </td> <td> British Columbia </td> <td> Alberta </td> </tr> . . . </table> </td> </tr> </table> 

Thereafter check the colspan and rowspan properties, and adjust accordingly.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM