[vc_row full_width=”stretch_row”][vc_column][stack_hero image=”38″][vc_column_text]<\/p>\n
These modular elements can be readily used and customized across pages and in different blocks.<\/p>\n
Explore all of Stack’s modular elements Stack’s dropdowns can serve a number of purposes, from navigation menu to multi-choice button. There are a number of ways to present a dropdown, but all follow the same markup pattern of a parent .dropdown<\/strong> element with a .dropdown__trigger<\/strong> which when clicked, will display the dropdown housed inside the .dropdown__container<\/strong> element.<\/p>\n The width of the dropdowns are controlled using the Bootstrap column classes.[\/vc_column_text][\/stack_boxed_content][\/vc_column][vc_column width=”1\/2″][stack_dropdown title=”Trigger Dropdown”][vc_column_text]I’m the content inside the .dropdown__content<\/strong>\u00a0element. My width is controlled using the Bootstrap column classes. You can read more about those\u00a0here<\/a>[\/vc_column_text][\/stack_dropdown][\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=”.vc_custom_1485825445121{margin-bottom: 30px !important;}”][vc_column width=”1\/2″][stack_boxed_content padding=”boxed–lg” background=”bg–secondary”][vc_column_text]<\/p>\n Easily create dropdown menus by nesting .menu-vertical<\/strong> elements inside the dropdowns.[\/vc_column_text][\/stack_boxed_content][\/vc_column][vc_column width=”1\/2″][stack_dropdown column_width=”2″ title=”Trigger Dropdown”][vc_column_text]<\/p>\n
\nat the\u00a0Element Index Page \u2192<\/a>[\/vc_column_text][\/stack_hero][\/vc_column][\/vc_row][vc_section][vc_row css=”.vc_custom_1485825445121{margin-bottom: 30px !important;}”][vc_column width=”1\/2″][stack_boxed_content padding=”boxed–lg” background=”bg–secondary”][vc_column_text]<\/p>\nBasic Dropdown<\/h4>\n
Menu Dropdown<\/h4>\n
Select an option<\/h5>\n