Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML HTML Video and Audio Media Basics The Audio Element

Posted by Binyamin Grobman
Binyamin Grobman
9,286 Points

this code is not working

<audio controls>

 <source
 src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge-mp3"type="audio/mp3" >

      </audio>
Jason Stroup
Jason Stroup
1,894 Points
Jason Stroup
Jason Stroup
1,894 Points

I did the same thing - you accidentally have ../bridge-mp3 -> needs to be -> ../bridge-audio.mp3

And for anyone else out there who copied the video src over I left my type as type="video/mp3" -> Make sure to change it to: type="audio/mp3"

4 Answers

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

At first glance, there should be a space between the attributes (before the word "type"). Let me know if that doesn't fix it and I'll investigate further.

Binyamin Grobman
Binyamin Grobman
9,286 Points

thanx but it didn't fix it. its the same code i used for the video and that works fine. <video controls> <source src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge.mp4"type="video/mp4">

<source src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge.ogg"type="video/ogg" >

  </video>
Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

It would help to see the whole project. You can make a snapshot (note: not "screenshot") of your workspace and post the link to it here.

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

So it turns out the problem was in the filename part of the URL in the "source" tag. The code is attempting to reference a file named "bridge-mp3", but the actual file name as shown in the video is "bridge-audio.mp3".

And you were right that the missing space between the attributes didn't matter, but it would still be good practice to have one there.

Binyamin Grobman
Binyamin Grobman
9,286 Points
Binyamin Grobman
Binyamin Grobman
9,286 Points

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>HTML Video and Audio</title>

<link rel="stylesheet" href="css/normalize.css">
<link href='http://fonts.googleapis.com/css?family=Nunito:400,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.css">

</head> <body>

<h1>HTML Video and Audio</h1>

<div class="wrapper">
  <h2>video</h2>
 <video controls>
 <source src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge.mp4"type="video/mp4">

<source src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge.ogg"type="video/ogg" >

  </video>
    <h2>audio</h2>

  <audio controls>


 <source
 src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge-mp3"type="audio/mp3" >

      </audio>
</div>

</body> </html>

I am writing the code on atom.

Binyamin Grobman
Binyamin Grobman
9,286 Points

https://w.trhou.se/94u0y7k2t3 I think this is the link for workspace

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

Great! That helped me find it by trying it out. See the comment I added to my answer.

Binyamin Grobman
Binyamin Grobman
9,286 Points

thank you that fixed it

djspell
djspell
4,463 Points
djspell
djspell
4,463 Points

I'm having a similar problem in my challenge task. Not allowing me to proceed though it seems that we've written the same thing? HELP!

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>HTML Video and Audio</title>

<link rel="stylesheet" href="normalize.css">
<link href='http://fonts.googleapis.com/css?family=Nunito:400,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="main.css">

</head> <body>

<h1>HTML Video and Audio</h1>

<div class="wrapper">

  <!-- Add your code below this line -->
<audio controls>
  <source src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge-audio.mp3" type="audio/mp3">
  </audio>
</div>

</body> </html>

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

You're probably working on a different challenge, perhaps the one where you are asked to add the "src" property directly to the "audio" tag without creating a "source" tag.

For future questions, always start a new question rather than asking one as an "answer" to another question. And if you start it from the "get help" button in a challenge, it should automatically paste in your code (with proper formatting) and add a button that links the course page.

djspell
djspell
4,463 Points
djspell
djspell
4,463 Points

thank you very much for your response, all set now.