This navbar was originally built by someone in the Coffeecup staff back in 2018, and it has a tutorial with videos here. The menu and the tutorial have been built on and updated more than once, and my version of it has had to be updated the same way. This is the latest version - as of Jan. 2025.
An issue with the styling of an element with a Foundation attribute has been a problem for many users. Here it has been solved by some style rules written in the head code box on the Element pane in SD.
The menu comes in two variations, with the main menu to the right side or centered. The difference is made with the flex styling of the element .subnav-section, whether the setting for align-items is set to 'center' or 'flex-end'. Thus a left-oriented nav could be made by changing to 'flex-start'.
Simple Navbar
This navbar was originally built by someone in the Coffeecup staff back in 2018, and it has a tutorial with videos here. The menu and the tutorial have been built on and updated more than once, and my version of it has had to be updated the same way. This is the latest version - as of Jan. 2025.
An issue with the styling of an element with a Foundation attribute has been a problem for many users. Here it has been solved by some style rules written in the head code box on the Element pane in SD.
The menu comes in two variations, with the main menu to the right side or centered. The difference is made with the flex styling of the element .subnav-section, whether the setting for align-items is set to 'center' or 'flex-end'. Thus a left-oriented nav could be made by changing to 'flex-start'.
Download this component (above)
Download the centered component