The Sizing design options allow you to control the dimensions and alignment of the Accordion module. These settings include options for width, height, and alignment, giving you the flexibility to tailor the module to fit your design.
Where to Find the Sizing Options
Open the Module Settings: Click the gear icon or the module itself to access the settings.
Navigate to the Design Tab: Locate the Sizing option group.
Sizing Customization Settings
Width: Specify the module's width with units such as pixels (px), percentages (%), or viewport-based measurements like vw.
Max Width: Define the maximum allowable width for the module to ensure it doesn’t stretch too far.
Module Alignment: Position the module to the left, center, or right. This setting is accessible only when Width or Max Width is specified.
Min Height: Specify the minimum height for the module to ensure it maintains consistent vertical space.
Height: Set a specific height for the module, overriding its default dynamic sizing.
Max Height: Restrict the maximum height of the module to prevent it from becoming too tall.
Note: The accepted units for all sizing options are px, %, em, rem, vw, vh, in, mm, cm, pt, and pc.
Tips for Using Sizing Options
Ensure Responsiveness: Utilize percentage-based or viewport units (%, vw, vh) to keep devices responsive.
Balance Design: Keep module sizing consistent with adjacent elements for a cohesive layout.
Alignment Matters: Use module alignment to center or position the Accordion visually, especially when setting custom widths.
These options give you precise control over the element’s dimensions, making it easy to align your design with your content and layout goals.