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
michellehartley
8,903 PointsWhy is the downloaded code different than the video lesson?
Why is the dowloaded project code different than what's in the video lesson? There is pasted code that isn't explained in the lesson. In the code challenge we're asked to make the img me blush disappear but I'm not seeing where she made it disappear. Also, the media querries appear different from the lesson screen and the downloaded code. Does it matter what order media querries are in? Just makes it hard to follow along the lesson when hers are different.
6 Answers
Kristopher Van Sant
Courses Plus Student 18,830 PointsOk I had to watch that video again and look at the code to see what was going on...and you're right she doesn't actually show or tell you how to remove the image, she just copies the code in without explaining. If you open up the code playground and look under the HTML section and go to line 38 I believe you'll find this code :
<div id ="intro-img" class="grid_3">
<object data="http://www.smellslikebakin.com/responsive/img/you-bake-me-blush.svg" type="image/svg+xml">
<!--[if lte IE 8 ]-->
<img src="img/you-bake-me-blush.gif" alt="You Bake Me Blush">
<!--![endif]-->
</object>
</div>
And we can see the id for the you bake me blush img is "intro-img"
Next in the css section on about line 221 there is the code for hiding the img
#intro-img {
display: none;
}
Hope that helps!
Kristopher Van Sant
Courses Plus Student 18,830 PointsThis is a great point to bring up because I've had a lot of the same issues! It seems like the downloaded project code is usually the final code as it will be when the project is completed. Which makes it very difficult to follow along on certain subjects because you get the eventual final answer but not exactly what's happening in the current video you're watching. I know this doesn't actually answer you're question so I guess I'm just saying you're not alone!..... I also just did a quick google search for your question about media queries....hope this helps a little, if not try googling it a bit more :)
http://www.webdeveloper.com/forum/showthread.php?260845-Order-of-media-queries-does-it-really-matter
http://mobile.smashingmagazine.com/2012/10/24/beyond-common-media-query-breakpoints/
michellehartley
8,903 PointsOn a couple of the videos the code shown around what she is typing in is different from what the downloaded code looks like so I have no idea where it really fits in sometimes. Although I can figure it out but we should be able to follow along what she is doing. I can't get past the one question which is so frustrating and nowhere in the video does she show how to remove the image.
michellehartley
8,903 PointsWell heck I had it right then. I wonder why it wasn't working then. I understand pasting code but there should be an explanation for what the code is for. I've taken advanced html5 and understand a lot of this. That's why I was so frustrated that I couldn't figure the answer out but seems i did have the answer to begin with. Now to figure out why it wouldn't take my answer. lol! Thank you very much Kristopher!
Kristopher Van Sant
Courses Plus Student 18,830 PointsI totally agree! No problem!
I also just took the code challenge again to see what the answer was for making the image disappear in the challenge and, if this is the same question you were stuck on, the answer is...
.cupcake img { display: none; }
The image itself didn't have an id or class like the one in the video and downloaded code did. So still a tad confusing.
michellehartley
8,903 PointsI agree. It tells you to make the makin me blush (or something like that) to disappear. That's one reason I was confused. Her code should be matching if they are going to make quiz questions based on that. Frustrating it is!