CODEWITHSUNDEEP
htmlcssw3c-validation
A.V.
A.V.

Reputation: 175

W3 Validation error, nested tags in an anchor tag

I have the following html code in my page:

<a class="fancybox" href="best-price.php">
<div id="bestprice">
</div><!--visitorinfo-->
</a>

At the validator I have the following message:

<div id="bestprice">

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

Any ideas?

Upvotes: 2

Views: 1165

Answers (2)

khollenbeck
khollenbeck

Reputation: 16157

You can't put a <div> tag inside of an <a> tag for doctypes prior to HTML5. But you could do something like this.

<a class="fancybox" href="best-price.php">
   <span id="bestprice">
   </span>
</a>

4.01 transitional: http://validator.w3.org/#validate_by_input

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><!-- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> -->
<head>
<title>test</title>
</head>
<body>
<a class="fancybox" href="best-price.php">
   <span id="bestprice">
   </span>
</a>
</body>
</html>

HTML5: http://validator.w3.org/#validate_by_input

<!DOCTYPE html>
<head>
<title>test</title>
</head>
<body>
<a class="fancybox" href="best-price.php">
    <span id="bestprice">
    </span>
</a>
</body>
</html>

Note: As Rob mentioned in the comments. This, 

<a class="fancybox" href="best-price.php">
    <div id="bestprice">
    </div>
</a>

Will validate in HTML5, but not in the older doctypes.

Upvotes: 5

Stickers
Stickers

Reputation: 78676

Use <span> to replace <div>

<a class="fancybox" href="best-price.php">
    <span id="bestprice">
        blabla
    </span><!--visitorinfo-->
</a>

And add CSS, to make it acts like a block element:

#bestprice {
    display: block;
}

Upvotes: 1

Related Questions