Menu changes for one breakpoint when published

[rvwalker]

Hi there,
My website was created with 90 second website builder version 12. It has four breakpoints and three of them work perfectly, but the 480 breakpoint vertical menu shifts left when published. Here is a page stripped to the basics for your review:
https://www.hisandhersphoto.com//test/hhtestmenu2.htm
Please let me know if you need anything else.
Ross Walker

[Pablo]

First note that version 12 is no longer supported.
Also, I cannot see what you have done based on the published page, because the software has thousands of options and millions of possible combinations.
So, there is no way to know which options you have used by looking at the HTML only.

To be able to help you, I need a DEMO project (.wbs file) so I can see all your settings.

I do not need the complete project because that will only take more time to figure out what you have done.
Basically, I just need a small project with one page and object(s) that are relevant to your question.

For further details about how to share a project file, please see this FAQ:
https://www.wysiwygwebbuilder.com/forum ... 10&t=82134

[rvwalker]

I hope this is what you need.
Yes, I realize version 12 is no longer supported, which is one reason I upgraded to version 17.
Here is a link to my .wbs file. https://www.hisandhersphoto.com/test/test_menu2.wbs
The problem is the vertical menu is not the same after publishing. This is a problem only for the 480 breakpoint. Everything else looks great.
All you need to do to duplicate the problem is preview or publish the .wbs file.
I hope this will be a simple fix so I won't have to redo more than 2500 pages!
Thanks,
Ross Walker

[Pablo]

The breakpoint of the CSS menu should be set to '767'

[rvwalker]

That did not work. The CSS menu is still incorrect for the 480 breakpoint.
I tried experimenting with other breakpoint settings and the problem did not change. Any ideas?
Ross

[Pablo]

I have tried it with your project and it works for me.
Are you sure the value is set correct? In the project you have shared it is set to 480

[rvwalker]

I have FOUR breakpoints in my project:
Default, 768, 480, and 320.
All four worked perfectly on version 12 but 480 does not work on version 17.
Are you suggesting that I eliminate 480? There are plenty of opinions on the internet, but I chose these four breakpoints years ago and they work for me. If you have a breakpoint recommendation I would like to know your thoughts about it. Is there a forum discussion somewhere?
Changing 768 to 767 really did not change anything and I would still like to get 480 working correctly again.
Thanks for your help.
Ross

[crispy68]

If you set the breakpoint in the CSS menu to 767 then it works for me also.

The second the browser window goes less than your 768px breakpoint it flips to vertical and the buttons are centered and equal length.

[rvwalker]

Thanks for checking in.
It still is not working for me, so let me try to get clarification:
1. Which breakpoint are you changing to 767? 480?
2. Is the menu equal length and centered AFTER PUBLICATION?
3. What browser are you testing this on? I am using Firefox.
4. Have you checked it on a phone? My Android phone shows that the menu is still wrong in horizontal position. It is correct in vertical position.
https://www.hisandhersphoto.com/test/hhtestmenu2.htm
Frustrating....
Ross

[crispy68]

1. As stated, I'm changing the breakpoint in the CSS menu not the page breakpoints. Open the CSS menu properties --> RWD and set it to 767.
2. There is no difference between preview and published. The same files are generated for both. If it doesn't look the same between the two, then it means you are missing files or did not upload all the files to the server.
3. Tested on Chrome, FF, Edge, Vivaldi, Opera, Brave and IE11
4. No. But based on the 7 browsers I tested, I would suspect it would work on my phone.

Here's my demo. Does it work for you?
https://wizbangwebdesign.com/demo/cssme ... tmenu2.htm

Update: #4 - yes, it looks correct on my phone.

[rvwalker]

THANK YOU.
That seems to have worked. What I was missing in all this was the "CSS" menu part of the explanation, although I did experiment with it early on.
This should be an easy fix and I appreciate your help.
Ross