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 trialAshley Tee
10,198 PointsResponsive SVG isn't working
I'm pretty sure I copied Nick's code, but my media queries aren't working. Can anyone help?
*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
body { font-family: 'Nunito', sans-serif; color: #384047; }
.wrapper { max-width: 90%; margin: 10px auto; padding: 10px 20px; background: #f4f7f8; border-radius: 8px; }
h1, h2 { margin: 30px 0; text-align: center; }
.graphic { margin: 1em auto; width:30%; display:block; }
.star-point, .outer-circle { opacity:0; } inner-circle { stroke-opacity: 0; }
.star { stroke-width: 8; }
@media only screen and (min-width: 30ems) { .inner-circle { stroke-opacity: 1; } }
@media only screen and (min-width: 40ems) { .outer-circle { opacity: 1; }
.star { stroke-width: 4; } }
@media only screen and (min-width: 64ems) { .star-point { opacity: 1; } }
1 Answer
Jonathan Gardner
8,383 PointsYou need to change the unit “ems” in your media queries to “em”. There is no “s”. Also on line 17 counting down from the first line of code, two declarations before your first media query, you forgot the “.” class selector before inner-circle. Hope that helps.