CSS Menu Breakpoint
Posted: Tue Nov 29, 2022 2:00 pm
Using the CSS menu in a project, I noticed when reaching the specified breakpoint (480), the menu behavior differs from what appears in the WB workspace. In preview, at 480 the menu items do not "stack" and stretch to the full width of the browser. Instead, they retain their pre-breakpoint widths and "word wrap" to form a second menu row.
This sample project demonstrates the issue.
If the menu breakpoint is set to 768, the menu does not break at 768, but instead breaks at 480 with the menu appearing "stacked" and full width (desired behavior).
In the workspace, all breakpoints display correctly and correspond to the breakpoint setting of the menu.
In the sample, switching the menu breakpoint between 768 and 480 will show you what I mean.
This sample project demonstrates the issue.
If the menu breakpoint is set to 768, the menu does not break at 768, but instead breaks at 480 with the menu appearing "stacked" and full width (desired behavior).
In the workspace, all breakpoints display correctly and correspond to the breakpoint setting of the menu.
In the sample, switching the menu breakpoint between 768 and 480 will show you what I mean.