Struggling with the final step of the “Build-a-Technical-Documentation-Page” project. It requires using at least one media query, and I’ve added three to my CSS. The verification isn’t passing despite the queries functioning correctly in preview mode.
CodePen: https://codepen.io/RGDC_codepen/pen/BagYdXW.
Any guidance would be greatly appreciated!
Hi there!
Add media query in the end of your css file. And I’m not sure the hover will work within media query.
Hi,
I checked your code and I don’t know if there is any other error there but it passes for me. Have you tried resetting and adding your code again?
After some investigation, I found that the issue was due to having more than one stylesheet linked in my project. The verification script was likely checking all stylesheets for the presence of media queries. Since one of my stylesheets didn’t contain any media queries, the script did not find the required media queries in all stylesheets, causing the test to fail.
I wanted to extend a big thank you to everyone who took the time to try to help me with my issue.
I hope this helps anyone facing the same issue.
I found a fix by removing one of the stylesheets. Did you use the “Run the tests” feature on the project exercise page, and did it pass for you? If you kept both stylesheets, did you make any changes to make it work?
The second stylesheet was used to style <pre><code> with Atom-One-Dark through an online library. I removed it and will now style them manually. If you found another way to keep both stylesheets, I’d be interested in trying that before resorting to manual styling.
PS: I did try resetting the code and re-adding before my fix, didn’t work for me until i removed the second stylesheet.
Thank you for your time.
Yes, I used the Run the Tests feature but I was only checking the CSS part of your code to see if the media queries work. Turns out the problem was in the other part. I’m glad you figured it out. Happy coding!