无效的HTML未封闭元素

Question

I am getting the following validation errors: 我收到以下验证错误：

Line 63, Column 7: End tag for body seen but there were unclosed elements.
</body>

Line 19, Column 25: Unclosed element section.<section id="content"

I am using a HTML5 validator and I suspect this error is why my sidebar is not aligning. 我正在使用HTML5验证程序，我怀疑此错误是为什么我的侧边栏无法对齐的原因。

CSS: CSS：

html{
    height:100%;
}
body{
    width:960px;
    height:100%;
    margin:0 auto;
}
p,h1,h2{
    margin:25px;
}
header{
    width:100%;
    border-bottom:1px solid green;
}
header #logo{
    height:90px;
    width:150px;
    border:1px solid red;
}

header nav{
    width:100%;
    height:45px;
    border:1px solid red;
}
header nav ul{
    float:left;
}
header nav ul li{
    display:inline;
}
header nav li a{
    float:left;
    text-decoration: none;
    margin-left:15px;
}

#content{
    float:left;
    width:705px;
    height:100%;
    border:1px solid red;
}
#showcase{
    position: relative;
    width:705px;
    padding:20px 0px 20px 20px;
}
#showcase ul{
    float:left;
    display:block;
    margin-left:-20px;
    margin-bottom:20px;
    width:200px;
    border:1px solid green;
    list-style:none;
}
#showcase ul li h3{
    margin: 0 0 0 -15px;
    letter-spacing: -0.25px;
    margin: 4px 0px 3px 0px;
    text-indent: 3px;
}

#showcase ul li h3 a {
    color: #010101;
    text-decoration: none;
}
#showcase ul li h3 a:hover {
    color: #4fbcd8;
}

#showcase ul p {
    height:70px;
    margin:0 0 0 -15px;
    line-height: 1.6em;
    padding-left: 3px;
}
#showcase ul img{
width:175px;
height:137px;
background-color:pink;
}
#sidebar{
    float:right;
    height:100%;
    width:225px;
    border:1px solid red;   
}
#box_one, #box_two, #box_three{
    height:100px;
    border-bottom:1px solid #ccc;
}
footer{
    clear:both;
    height:24px;
    border:1px solid red;
}

HTML: HTML：

<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>Template 2011</title>
    <link rel="stylesheet" href="_assets/css/style.css">
</head>
    <body>
        <header>
            <div id="logo">Template Here</div>
                <nav>
                    <ul>
                        <li><a href="#">Page One</a></li>
                        <li><a href="#">Page Two</a></li>
                        <li><a href="#">Page Three</a></li>
                        <li><a href="#">Page Four</a></li>
                        </ul>
                </nav>
        </header>
            <section id="content">
                <h1>Main Content Section</h1>
                    <p>Content</p>
                        <section id="showcase">
                            <h1>My Work</h1>
                                <ul><!-- Showcase One -->
                                    <li>
                                        <a href="#"><img src="#" alt="#" /></a>
                                        <br/>
                                        <h3><a href="#">Photography</a></h3>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sem massa, auctor ac tempor at, congue quis erat. Fusce at adipiscing magna. Duis iaculis quam vel ante aliquam eget faucibus nisi pretium. Aenean varius tempus vulputate. Cras ipsum nisi, vehicula id aliquam a, blandit iaculis felis. Sed viverra diam purus. Nam tempor, risus feugiat auctor tristique, arcu massa gravida diam, scelerisque luctus dolor magna eget sapien.</p>
                                    </li>
                                </ul>
                                <ul><!-- Showcase Two -->
                                    <li>
                                        <a href="#"><img src="#" alt="#" /></a>
                                        <br/>
                                        <h3><a href="#">Photography</a></h3>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sem massa, auctor ac tempor at, congue quis erat. Fusce at adipiscing magna. Duis iaculis quam vel ante aliquam eget faucibus nisi pretium. Aenean varius tempus vulputate. Cras ipsum nisi, vehicula id aliquam a, blandit iaculis felis. Sed viverra diam purus. Nam tempor, risus feugiat auctor tristique, arcu massa gravida diam, scelerisque luctus dolor magna eget sapien.</p>
                                    </li>
                                </ul>
                                <ul><!-- Showcase Three -->
                                    <li>
                                        <a href="#"><img src="#" alt="#" /></a>
                                        <br/>
                                        <h3><a href="#">Photography</a></h3>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sem massa, auctor ac tempor at, congue quis erat. Fusce at adipiscing magna. Duis iaculis quam vel ante aliquam eget faucibus nisi pretium. Aenean varius tempus vulputate. Cras ipsum nisi, vehicula id aliquam a, blandit iaculis felis. Sed viverra diam purus. Nam tempor, risus feugiat auctor tristique, arcu massa gravida diam, scelerisque luctus dolor magna eget sapien.</p>
                                    </li>
                                </ul>           
            </section>
                <section id="sidebar">
                    <div id="box_one">
                        <p>Box One</p>
                    </div>
                    <div id="box_two">
                        <p>Box Two</p>
                    </div>
                    <div id="box_three">
                        <p>Box Three</p>
                    </div>
                </section>
            <footer>
                <p>This is the footer</p>
            </footer>
</body>

Answer 1

add a </section> closing-tag on line 48 just above the other </section> . 添加</section>上的正上方的另一条线48闭合标签</section> 。 it is missing there 它在那里不见了

Answer 2

The following portion of code seems to be missing an end section tag: 以下代码部分似乎缺少结尾部分标签：

                <p>Content</p>
                    <section id="showcase">
                        <h1>My Work</h1>
                            <ul><!-- Showcase One -->
                                <li>
                                    <a href="#"><img src="#" alt="#" /></a>
                                    <br/>
                                    <h3><a href="#">Photography</a></h3>
                                    <p>Lorem ipsum...</p>
                                </li>
                            </ul>
                            <ul><!-- Showcase Two -->
                                <li>
                                    <a href="#"><img src="#" alt="#" /></a>
                                    <br/>
                                    <h3><a href="#">Photography</a></h3>
                                    <p>Lorem ipsum....</p>
                                </li>
                            </ul>
                            <ul><!-- Showcase Three -->
                                <li>
                                    <a href="#"><img src="#" alt="#" /></a>
                                    <br/>
                                    <h3><a href="#">Photography</a></h3>
                                    <p>Lorem ipsum...</p>
                                </li>
                            </ul>

无效的HTML未封闭元素

问题描述

2 个解决方案

解决方案1
1 已采纳 2011-09-18 06:29:49

解决方案2
0 2011-09-18 06:29:08

无效的HTML未封闭元素

问题描述

2 个解决方案

解决方案1 1 已采纳 2011-09-18 06:29:49

解决方案2 0 2011-09-18 06:29:08

解决方案1
1 已采纳 2011-09-18 06:29:49

解决方案2
0 2011-09-18 06:29:08