Search code examples
cssportfoliocollapsableelementorwp-list-categories

adding a menu or a dropdown to smaller screen sizes

How can I make categories listing appear in a dropdown on smaller screens? Similar to the concept where a navigation bar with pages is substituted for a hamburger menu on smaller screens.

So on the current website that I'm designing using Jupiter Wordpress theme with Elementor page builder. I wanned to create a project page where it would display a Blog list type of element with categories uptop

See attached image below

Screen Shot

I'm new to coding :D i have a rough understanding of the structure of things when it comes to HTML and CSS.

Thank you in advanced :D

Solution

  • Very useful in your case will be @media selector. You can use @media to detect i.a. size of the screen, and apply for it other CSS properties. For example:

    @media (max-width: 500px) {
  header {
    display: none;
  }
}

    I hope, that i helped ;)