Layout Settings
Divi MadMenu Layout Settings allow controlling the header elements vertical and horizontal alignment, set the element's column width, the dropdown menu direction, as well as order the elements differently for each device.
The layout settings are located in the Design tab of the module settings separated into two sections:
1. Layout: General
The settings in the Layout:General section allow to align the elements(not their content) horizontally within the module main container, set the dropdown menu direction and order the elements.
Elements can be ordered responsively which allows to have different header structures on each device( Desktop, Tablet and Phone). By default all the elements order has a 0(zero) value, and increasing this value moves the element to the right hand side of the header.
The order value is a relative value, so, the element with a larger order value will be closer to the right hand side than the element with a smaller order value.
The individual element layout settings are located in the Layout:Elements section. These settings allow setting the element's column width as well as align the element's content vertically and horizontally.
2. Layout: Elements
Each element's individual layout settings are placed under a tab labeled using the first letter(s) of the element's name the following way:
- DM: Desktop Menu element
- MM: Mobile Menu element
- L: Logo element
- S: Search element
- C: Cart element
- B1: Button One element
- B2: Button Two element
For example, the Desktop Menu element's layout settings are under the tab with the DM label
The element content can be aligned both vertically and horizontally but in order for the alignment to take effect the content width/height should be less than the element's column width/height.
The element columns are stretched vertically by default and their height depends on the module's main container height, however, the width of the column can be controlled using the Column Width and Column Max Width settings of each element.
The column width can be set using different units ( px, %, etc.) but setting its width value to auto will make the column push other elements to the sides and occupy all the available space (the column will be stretched horizontally).
Fixed Header Layout Settings
The fixed header layout settings of each element are located in the same tabs in the Layout:Elements section and become available when the fixed header is enabled in Advanced->Position->Enable Fixed Header
