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 Build a Responsive Website Advanced Techniques Flexible Videos with FitVid.js

Posted by Paula Viera
Paula Viera
2,409 Points

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,730 Points
Andrew McCormick
Andrew McCormick
17,730 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.

Paula Viera
Paula Viera
2,409 Points
Paula Viera
Paula Viera
2,409 Points

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

Paula Viera
Paula Viera
2,409 Points
Paula Viera
Paula Viera
2,409 Points 
<!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,730 Points
Andrew McCormick
Andrew McCormick
17,730 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">

Paula Viera
Paula Viera
2,409 Points
Paula Viera
Paula Viera
2,409 Points

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

Andrew McCormick
Andrew McCormick
17,730 Points
Andrew McCormick
Andrew McCormick
17,730 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>
Paula Viera
Paula Viera
2,409 Points
Paula Viera
Paula Viera
2,409 Points

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