Responsive Menu With Media Queries (Checkbox Trick) - Using Only CSS3

Responsive Menu With Media Queries (Checkbox Trick) – Using Only CSS3

30 thoughts on “Responsive Menu With Media Queries (Checkbox Trick) – Using Only CSS3

  1. I've been searching and watching several videos on the hamburger menu and I am so glad to have stumbled on yours. It's the most clear, straightforward, and easy to follow tutorial. And you've explained your steps very well. Thank you!

  2. Hey again, I am having an issue. When I try to add an image under the burger menu, in the <body> like this <div class="container">

    <div class="header">

    <div class="Church of Christ">

    <img src="IMG_2597.jpg" width="140" height="170" alt="Church of Christ"/>


    the burger menu is under the image for some reason and will not show the navigation menus. The burger is still there. The image overlaps the menu however, please help! <3 πŸ˜€

  3. Thanks, man, so many other tutorials are so complicated for a newbie like me. But this was simple and I understood everything. Thanks, again.

  4. Everything is working great except when I hover over the hamburger menu the pointer does not show, I'm not sure if it is the @media, but I checked all the code and it matches. Could someone help resolve this issue?

  5. Caler, you're a lifesaver and a design superstar!! I watched about 3 tutorials before watching this one and none of them come close, thanks a mill

  6. Media query is not working on mobile devices but it works fine when the browser is resized. How can i correct it.

  7. how do you get the menu to collapse after clicking a link? Mine closes after clicking menu icon but would be ideal for it to close automatically after selecting link

  8. This is one of the best tutorials I have seen. The explanations are clear…and nothing is omitted or assumed. You are a great teacher. Thank you!!!!

  9. Are you connected to a server or localhost that your changes in Brackets change automatically without refreshing the browser? How can I set this up? Thanks!

Leave a Reply

Your email address will not be published. Required fields are marked *