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
Arnold Omwango
Courses Plus Student 1,969 PointsSome help please!
I am stuck. Should I copy and paste this code or cut and paste?
Mat Helme
Treehouse Guest TeacherWhat seems to be the problem Arnold Omwango ?
Arnold Omwango
Courses Plus Student 1,969 PointsHi Mat Helme, I am trying to move on with the challenge but what Alison says in the tutorial video is not very clear to me. I need to know if one is supposed to cut and paste the .menu and .contact codes under the media querie. Hope this is clear
the second task in the link above
Mat Helme
Treehouse Guest TeacherAre you putting the styles for the two classes inside the media query brackets?
Can you show me what code you're inputting?
Arnold Omwango
Courses Plus Student 1,969 PointsTo be honest Mat Helme this task of all the others is so far the most challenging. If you can just do the challenge through the link and let me know how you did it it would help. If its no trouble
Mat Helme
Treehouse Guest TeacherArnold Omwango I just completed the challenge and everything is working great on my end.
What question specifically are you having trouble with?
What's the answer you are submitting and getting an error on?
Arnold Omwango
Courses Plus Student 1,969 PointsIn the second challenge task, I tried copying the .menu and .contact between the brackets in the media query { }, but the answer comes' did you add the codes into the media query?. So am I supposed to cut and paste or what?
1 Answer
Mat Helme
Treehouse Guest TeacherArnold Omwango Are you using proper css syntax inside the media query brackets?
i.e.
@media screen and (max-width : 480px) {
.contact { <!-- css styles here -->}
.menu { <!-- css styles here -->}
}
Arnold Omwango
Courses Plus Student 1,969 Pointswhere do I get the " <!-- css styles here -->" ?
Matthew Willmott
9,426 PointsHi Arnold, So you're have problems with "Add the appropriate CSS code to the media query so that ".contact" and ".menu" fill the entire container width when the device or browser width is at most 480px wide."
On this question, scroll down to the bottom of the CSS in your code pane on the left and you will see something like this media query: /* Mobile ----------- */ @media screen and (max-width : 480px) { }
As you can see, that will be where you place any styling that you want to apply to the page when it's width is anything up to 480px. You need to put the appropriate styles in-between the curly braces at the end.
So the question asks you to add the appropriate styles to make ".contact" and ".menu" to make them fill the entire container width when the page is under 480px wide. This is basically asking you to make them fit 100% of the width of the container. So you add this styling in the media query.
Does this help at all?
Arnold Omwango
Courses Plus Student 1,969 PointsSo Matthew Willmott, what you are saying I know will work but I just need an answer like " put .contact...between the curly braces" I need the code to put in, even though it will be like cheating in exams but I will have learned something. What is the appropriate styles?
Arnold Omwango
Courses Plus Student 1,969 PointsMatt Helme, I finally managed to get the second part right. now on to the third task
Add the appropriate CSS code to the media query so that images within the ".cupcake" div disappear when the device or browser width is at most 480px wide.
How do I go about this and thanks for the lesson Matthew Willmott
Mat Helme
Treehouse Guest TeacherFor this step the task is to hide or display nothing per the images inside of the div ".cupcake". Just like the previous task which you had entered the css values inside the media queries you will do the same for this task. Simply add in the correct css which will allow you to hide the images inside of the class labeled cupcake.
Here are two hints that will help you one identify the correct "img" tag and the css display properties.
Arnold Omwango
Courses Plus Student 1,969 PointsArnold Omwango
Courses Plus Student 1,969 PointsI am done with challenge task 1...Challenge task 2 and 3 are the ones giving me a hard time