首页 > 解决方案 > 如何将此菜单分成两列?

问题描述

我有此图像的以下代码。但我想将产品菜单分成两列。

[vc_row enbale_extend_design_options="yes" vc_custom_design_options_reponsive="%5B%7B%22screen%22%3A%22custom%22%2C%22screen_custom%22%3A%221024%22%2C%22background_image_none%22%3A%22yes%22%7D%5D" css=".vc_custom_1548125627238{padding-top: 25px !important;padding-right: 30px !important;padding-bottom: 150px !important;padding-left: 30px !important;background-image: url(https://tangofabrics.com/wp-content/uploads/2019/01/bgmenu.jpg?id=3081) !important;background-position: 0 0 !important;background-repeat: no-repeat !important;border-radius: 3px !important;}" responsive_js_composer_custom_id="responsive_js_composer_custom_css_1848579383" el_class="bg-shop"][vc_column offset="vc_col-lg-4 vc_col-md-4" responsive_js_composer_custom_id="responsive_js_composer_custom_css_843216826"][lebe_custommenu style="style-01" title="Discover" menu="discover" custommenu_custom_id="lebe_custom_css_382494862" responsive_js_composer_custom_id="responsive_js_composer_custom_css_1825951247" css=".vc_custom_1548316865456{padding-bottom: 20px !important;}"][/vc_column][vc_column offset="vc_col-lg-4 vc_col-md-4" responsive_js_composer_custom_id="responsive_js_composer_custom_css_1343847516"][lebe_custommenu style="style-01" title="Products" menu="products" custommenu_custom_id="lebe_custom_css_59645647" responsive_js_composer_custom_id="responsive_js_composer_custom_css_16630816" css=".vc_custom_1547603029191{padding-bottom: 20px !important;}][/vc_column][vc_column offset="vc_col-lg-4 vc_col-md-4" responsive_js_composer_custom_id="responsive_js_composer_custom_css_1472824855"][lebe_custommenu style="style-01" title="Whole Sale" menu="whole-sale" custommenu_custom_id="lebe_custom_css_1688727375" responsive_js_composer_custom_id="responsive_js_composer_custom_css_666722841" css=".vc_custom_1547603037530{padding-bottom: 20px !important;}"][/vc_column][/vc_row]

参考图像

标签: htmlcss

解决方案


您可以在父级上使用 Css 属性“列计数” :

    column-count: 2;

推荐阅读