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: Set the width of the module using a specific unit such as pixels (px), percentages (%), or viewport-based units like vw.
Max Width: Define the maximum allowable width for the module to ensure it doesn’t stretch too far.
Module Alignment: Align the module to the left, center, or right. This option is only available when Width or Max Width is set.
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: Use percentage-based or viewport units (%, vw, vh) to maintain responsiveness across devices.
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.