Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML Build a Responsive Website Advanced Techniques Flexible Videos with FitVid.js

Using the unique ID defined within the fitvid script, add the appropriate code to the div that contains the embedded vid

Not sure what they are Using the unique ID defined within the fitvid script, add the appropriate code to the div that contains the embedded video so it scales with the fluid layout.

<!DOCTYPE html>
<html>
<head>
        <link href='style.css' rel='stylesheet' type='text/css'>
        <link href='https://fonts.googleapis.com/css?family=Nunito:400,300,700' rel='stylesheet' type='text/css'>
    </head>
<body>
    <div class="container">
        <div class="grid_6 omega">
      <div id="#featured-video">
                <iframe src="http://player.vimeo.com/video/50610288?title=0&amp;byline=0&amp;portrait=0" width="400" height="225" frameborder="0"></iframe>     
            </div>
    </div>

    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script src="jquery.fitvids.js"></script>
    <script>
      $(document).ready(function(){
        $("#featured-video").fitVids();
      });
</script>
</body>

</html>

looking for here??

7 Answers

Andrew McCormick
Andrew McCormick
17,729 Points

you are looking for the ID that is used in the fitvid script. The fitvid script is:

<script src="jquery.fitvids.js"></script>
<script>
$(document).ready(function(){
$("#featured-video").fitVids();
});
</script>

An ID tag is always selected using the '#' sign. So find that in the script and you will have the ID tag that is being defined in the script.

Isn't that it? <div id="#featured-video"> Thanks for your help.

<!DOCTYPE html>
<html>
<head>
        <link href='style.css' rel='stylesheet' type='text/css'>
        <link href='https://fonts.googleapis.com/css?family=Nunito:400,300,700' rel='stylesheet' type='text/css'>
    </head>
<body>
    <div class="container">
        <div class="grid_6 omega">
      <div id="#featured-video">
                <iframe src="http://player.vimeo.com/video/50610288?title=0&amp;byline=0&amp;portrait=0" width="400" height="225" frameborder="0"></iframe>     
            </div>
    </div>

    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script src="jquery.fitvids.js"></script>
    <script>
      $(document).ready(function(){
        $("#featured-video").fitVids();
      });
</script>
</body>

</html>
Andrew McCormick
Andrew McCormick
17,729 Points

Paula, you need to add the ID to the div, not a new div inside of the other div. Think <div id="someID" class="someClass">

Hi Andrew.. Tried that as well.. Thanks for your help. Paula

Andrew McCormick
Andrew McCormick
17,729 Points

did it work when you tried it? Here's what I did and it worked in the code challenge:

        <div class="grid_6 omega" id="featured-video">
                <iframe src="http://player.vimeo.com/video/50610288?title=0&amp;byline=0&amp;portrait=0" width="400" height="225" frameborder="0"></iframe>     
        </div>

Yes.. it worked when I added that code.. perhaps it was a quotation mark.. thanks for your help.