Member Avatar for mitchell.schols

So, i'm working on a layout that has to be in xhtml.. i changed the extension from html > xhtml and i got this prompt..

"This page contains the following errors:

error on line 15 at column 8: Opening and ending tag mismatch: link line 0 and head
Below is a rendering of the page up to the first error"

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">

        <link rel="stylesheet" href="fonts.css">
        <link rel="stylesheet" href="normalize.min.css">
        <link rel="stylesheet" href="main.css">


</head>
<body>

<section>

  <header> <!-- TOP SECTION OF THE LETTER -->
    <div id="name-address-from">
      <p id="fullname">Dixie Cleverelle</p>
      <p id="company">The biz</p>
      <p id="address">28 Green St. Suite 15 </br>
      Upstate, NY 10946</p>
    </div>

    <div id="date">
      <p id="thedate">December 3rd /13</p>
    </div>


    <div id="name-address-too">
      <p id="fullname-too">Ms. Margaret Jones</p>
      <p id="company-too">The other biz</p>
      <p id="address-too">48 Stanstead Road </br>
      London SE37 1HF</p>
    </div>

    <div id="subject">
      <h1>For the Attention Of:</h1>
    </div> 
  </header> <!-- TOP SECTION OF THE LETTER --> 









  <article> <!-- THE CONTENT OF THE LETTER -->
    <div id="content">
      <p class="paragraph-first">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi pulvinar augue nibh, eget vestibulum ligula tincidunt venenatis. Aenean molestie lectus at pulvinar tempor. Nullam convallis odio arcu, lobortis pellentesque tortor ornare sit amet. Morbi sodales metus vel massa tempus scelerisque. Integer commodo mollis consequat. Curabitur tristique, mi in suscipit ornare, lacus lorem dapibus lectus, vehicula commodo dolor metus ut metus. Curabitur sollicitudin hendrerit lectus sit amet cursus. Vivamus dolor nulla, porttitor quis convallis nec, placerat sit amet velit.
      </p>

      <p class="paragraph-second">
Etiam eu consectetur nibh. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eget sollicitudin velit, eu varius ligula. Sed nisi erat, dignissim eleifend scelerisque non, tincidunt sed nisl. Proin quis volutpat augue, non sollicitudin arcu. Aliquam erat volutpat. In et eros viverra, tincidunt orci eget, aliquam lectus. Nam dignissim sapien lorem, id faucibus ante fermentum eu.

      </p>
    </div>
  <article> <!-- THE CONTENT OF THE LETTER -->










  <footer>
    <div id="from">
      <p>Sincerely yours, <br/>
      <h3>Mitch Schols</h3></p>
    </div>
  </footer>

</section>



    </body>
</html>
  • 3 Contributors
  • 2 Replies
  • 18K Views
  • 4 Years Discussion Span
  • Latest Post Latest Post by Pradosh_1

Dani AI

Generated

That error means the browser is parsing your file as XML (because of the .xhtml extension or MIME type) and hit an empty element that was not closed using XML syntax. In XHTML, all elements must be well-formed: empty elements are self-closed, tag nesting must be proper, and you cannot rely on HTML’s forgiving parsing.

Checklist to resolve quickly:

  • Make all empty/void elements self-closing: e.g., <meta ... />, <link ... />, <br />, <img ... />, <hr />, <input ... />.
  • Ensure proper nesting. For example, do not put a heading inside a paragraph; close the paragraph before starting a heading.
  • Close every non-void element you open and in the right order (e.g., open <article> then later </article>).
  • Keep attributes quoted and element/attribute names lowercase in XHTML.
  • If you are not actually using additional namespaces, remove them to reduce complexity.
  • The HTML5 doctype <!DOCTYPE html> is fine for XHTML5; what matters is well-formed XML syntax.

Two important notes:

  • The correct MIME type for real XHTML is application/xhtml+xml. If served as text/html, browsers use the HTML parser and will not report XML well-formedness errors. Internet Explorer does not support application/xhtml+xml rendering, so avoid XHTML unless you truly need it.

Useful references: XHTML (MDN), XML serialization of HTML documents, Void elements list, and the Nu HTML Checker.

Member Avatar for Jan-Willem

Several tags have not been closed; the meta's, the link's; later on there's several </br> that should be <br />.
A few other erors as well (missing </article>.

xhtml is a lot more picky than html...

Member Avatar for Pradosh_1

<div class="container"> <h1>Use Bootstrap's carousel to show multiple items per slide.</h1> <div class="row"> <div class="col-md-12"> <div class="carousel slide multi-item-carousel" id="theCarousel"> <div class="carousel-inner"> <div class="item active"> <div class="col-xs-4"><a href="#1"><img src="http://placehold.it/300/f44336/000000" class="img-responsive"></a></div> </div> <div class="item"> <div class="col-xs-4"><a href="#1"><img src="http://placehold.it/300/e91e63/000000" class="img-responsive"></a></div> </div> <div class="item"> <div class="col-xs-4"><a href="#1"><img src="http://placehold.it/300/9c27b0/000000" class="img-responsive"></a></div> </div> <div class="item"> <div class="col-xs-4"><a href="#1"><img src="http://placehold.it/300/673ab7/000000" class="img-responsive"></a></div> </div> <div class="item"> <div class="col-xs-4"><a href="#1"><img src="http://placehold.it/300/4caf50/000000" class="img-responsive"></a></div> </div> <div class="item"> <div class="col-xs-4"><a href="#1"><img src="" class="img-responsive"></a></div> </div> <!-- add more items here --> <!-- Example item start: --> <div class="item"> <div class="col-xs-4"><a href="#1"><img src="" class="img-responsive"></a></div> </div> <!-- Example item end --> </div> <a class="left carousel-control" href="#theCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a> <a class="right carousel-control" href="#theCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a> </div> </div> </div> </div>

commented: To old post with poor formatting. Try again and preview your posts. -3
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.