How can I get my menu to stay visible when the page scrolls??

All WYSIWYG Web Builder support issues that are not covered in the forums below.
Forum rules
IMPORTANT NOTE!!

DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.



PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
Post Reply
alan_sh
 
 
Posts: 1695
Joined: Tue Jan 01, 2019 5:50 pm

How can I get my menu to stay visible when the page scrolls??

Post by alan_sh »

I have a layout grid with position as "header(fixed" and that does really well - staying at the top of the page when the page scrolls up. It is filled with 3 images all nicely centred.

I also have a CSS menu just underneath, also centred. But I want that to stay visible (always on top?) when the page scrolls and I can't seem to find any way of doing it.

I've created a sample project with two pages on. One, the index page, which is how I would like it. The second one, I put the menu into the layout grid in the centre grid and it looks OK in WB15, but in a preview, the header shoots up and to the right in default view, pushing the image off centre. Interestingly, the other breakpoints all look OK.

So, either I have found a bug or I am not doing it right.

Can anyone advise me?

My sample project is here https://www.dropbox.com/s/kaxc0e6nt9r67 ... t.zip?dl=0

thanks

Alan
User avatar
Pablo
 
Posts: 21708
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: How can I get my menu to stay visible when the page scrolls??

Post by Pablo »

The element inside a layout grid are floating. So, they are place next to each other unless is no space in which case the element will wrap to the next line.

So, in design mode the CSS menu is below the logo, because there is no space at the left of the logo, but as soon as you make the page wider it will float to the right of the logo.

To prevent this you can (for example) insert a line (set to full width) between the logo and menu so the menu will be forced to a new line.
or set the logo to full width and the max-width to 528.
alan_sh
 
 
Posts: 1695
Joined: Tue Jan 01, 2019 5:50 pm

Re: How can I get my menu to stay visible when the page scrolls??

Post by alan_sh »

Thanks.

I couldn't get the first option to work, but the second one was fine.

Alan
Post Reply