Jump to content

sidebar menu below full width header-div

Recommended Posts


I have been searching for a solution to have a responsive full-width image in a header-div and
a left sidebar-menu that stays underneath the header.
When on small screens the menu should toggle in and out, covering the content below the header.

All examples I found use a position:fixed for the sidebar covering-up the header for a part.

I am using w3.css and am experimenting with w3-hide-small with no luck.

Any hint?




Share this post

Link to post
Share on other sites

I have come this far:


What is missing is the menu getting to (display:none), the moment the width gets medium or small.


Of cause, mediaqueries  . . .

Now I will make the menu get over the content, then I am at the same point that the examples had
I used before where the menu is positioned fixed.
Putting the problem in words is a part of the solution!


Edited by ruitertje
  • Like 1

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Create New...