Visual Studio HTML5 Validation: Element 'img' cannot be nested within element 'a'
Asked Answered
B

2

7

I've run into this curious validation error in Visual Studio 2010 with HTML5 validation selected:

Validation error

Is this a validation error (legitimate or a bug in Visual Studio) or am I missing something obvious and simple?


Edit: added relevant code.

View cshtml:

@model My.Web.ViewModels.ListVideos

@{
    ViewBag.Title = "All Videos";
}

@foreach (var item in Model.Videos) { 
    <a href="@Url.Action("Play", "Player", new { videoId = item.VideoId })">
        <img src="http://i2.ytimg.com/vi/@item.PublisherVideoId/default.jpg" alt="@item.Title" style="border: 0" />
    </a>
}

_Layout.cshtml:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.6.4.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
</head>
<body>
    <div class="page">
        <header>
            <div id="title">
                <h1>My Web</h1>
            </div>
            <div id="logindisplay">
                @Html.Partial("_LogOnPartial")
            </div>
            <nav>
                <ul id="menu">
                    <li>@Html.ActionLink("Videos", "ListVideos", "Player")</li>
                    <li>@Html.ActionLink("Dev", "Index", "Dev")</li>
                </ul>
            </nav>
        </header>
        <section id="main">
            @RenderBody()
        </section>
        <footer>
        </footer>
    </div>
</body>
</html>
Bettinabettine answered 25/10, 2011 at 21:27 Comment(2)
Can you paste in the entire relevant block of HTML in addition to your screenshot?Unbodied
My code is stupid simple and is using the default MVC3 web app template, but I've included it anyways.Bettinabettine
S
11

You need visual studio 2010 SP1 web standards update to have this work properly. It is a bug.

See more here: http://blogs.msdn.com/b/webdevtools/archive/2011/06/15/web-standards-update-for-visual-studio-2010-sp1.aspx?PageIndex=2

Get the web standards update here: http://visualstudiogallery.msdn.microsoft.com/a15c3ce9-f58f-42b7-8668-53f6cdc2cd83

Stewart answered 25/10, 2011 at 21:47 Comment(2)
I have SP1: Version 10.0.40219.1 SP1RelBettinabettine
That's it, the web standards update worked. Thanks! On that note, it would be nice if there was an easy way to sync updates (or see notifications of such) across machines. My desktop had the update but my laptop did not.Bettinabettine
U
2

If you check the W3C documentation about Html5 you will find that you can have inside a a tag anything if it's not button or other links.

The a element may be wrapped around entire paragraphs, lists, tables, and so forth, even entire sections, so long as there is no interactive content within (e.g. buttons or other links).

Ulund answered 27/8, 2012 at 12:46 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.