HTML 5 validation error in Visual Studio 2010 MVC 3

Question

I am confused why Visual Studio 2010 gives me the following validation error in my original tag.

Validation (HTML5): The element 'source' cannot be nested in the element 'Audio'

Below is my code in cshtml View:

@{ ViewBag.Title = "Audio"; string audioURL = Url.Content("~/Content/Audio/untitled.mp3"); } <div> <audio id ="myAudio" controls preload="auto"> <source src="@audioURL" type="audio/mpeg" /> </audio> </div> 

I look around and I have seen many references to several src attributes in the tag. But this does not answer my question, why is there a validation error? This is really correct, but VS2010 considers it wrong, or is it really wrong, and if so, why is it wrong?

Answer 1

I found the problem, this is an error in Visual Studio 2010, looking, although their documents I found this link Web Standards Update for Visual Studio 2010 Service Pack 1 (SP1)

This is what they said about the problem, and the update should fix it.

The HTML 5 support included in SP1 has added intellisense and validation for many new elements, such as video and source elements. However, there were errors, and one of them was an error that you would see when adding source elements to video elements. This update is fixed, so now you also get intellisense for the source element.

Answer 2

Its character is ~ in the string audioURL.

Quote from a similar question on forums.asp.net

~ character in src attribute will not be reconginsed in HTML tags!

you cannot use the deilder label to go to the root level if this is not server management. Use .. to go to the top directory and so on. This is how you should determine the relative path for the HTML controls. For Example: src = "../Mp3/RonaldReaganChallengerAddress.mp3"

Answer 3

Remove quotes from src source attribute. This is already a line

  <audio id ="myAudio" controls preload="auto"> <source src = @audioURL type="audio/mpeg" /> </audio>