HTML not correctly parsed in Firefox and Chrome
Question
With this snippet of HTML, the topmost google link is included in every element under it when shown in Firefox and Chrome.
<div>
<a href="http://www.google.com/">
<div>
<div>
<div>
<div>
<a>a tag</a>
</div>
<img />
<h3>a title</h3>
<p>a description</p>
<div>a detail</div>
</div>
</div>
</div>
</a>
</div>
What is causing this parsing issue and how can I fix it?
1 answers
solution1
3 ACCPTED 2013-09-06 22:46:28
Try dropping the following document into the W3C Validator :
<!DOCTYPE html>
<html>
<head>
<title>Parse error?</title>
</head>
<body>
<div class="g23">
<a href="http://www.google.com/">
<div class="article-bg">
<div class="splash-border-right">
<div class="splash-content-margin">
<div>
<a href="http://www.google.com/">a tag</a>
</div>
<img src="http://www.google.com/image.jpg" />
<h3 class="splash">a title</h3>
<p>a description.</p>
<div class="read-time">a min</div>
</div>
</div>
</div>
</a>
</div>
</body>
</html>
Observe that this document is not valid HTML5. The first error:
Line 13, Column 65: An a start tag seen but an element of the same type was already open.
That is, a tags must not include other a tags. According to Alohci in the comments, Chrome and Firefox's behavior matches the HTML5 spec's adoption agency algorithm for this scenario. It's funky, but, with invalid code, funky results are to be expected.
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.