Support » Theme: OceanWP » OceanWP header on mobile only

  • Resolved zaperu



    I want the OceanWP menu (Fullscrenn menu) to show on mobile only because I created a menu for desktop with elementor wich fits my site better in my opinion.

    I played with custom css for a bit and I managed to hide all header elements on desktop. But there is still a gap. I set the header hight to 1px because I dont know how to set it on 0px via CSS. You can see that 1px gap on the page I linked.

    Im sure there is an easier way to do it but unfortunately I barely know any CSS.


    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Theme Author oceanwp


    Hello, add this css code:

    #site-header {
        display: none;
    @media (max-width: 480px) {
    #site-header {
        display: block;

    You can increase the 480px number if you want to display the header before that size.

    Wow, thanks for the fast reply!
    Works perfectly fine!

    Theme Author oceanwp


    You’re welcome 🙂

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘OceanWP header on mobile only’ is closed to new replies.