multiple columns in the drop down navigation menu

Site URL: https://www.g11lab.org/

Hi every one,

As I have long list of topic under one category, how I can create multiple columns in the drop down navigation menu?

or put the list in horizontal instead of vertical?

my site issue:

the result that I am looking for: 

My website info:

https://www.g11lab.org

Pass: 123

Thanks in advance 

Add to Home > Design > Custom CSS

div.header-nav-folder-content {
    column-count: 4;
    width: auto !important;
}

On 12/5/2020 at 8:25 AM, tuanphan said:

Add to Home > Design > Custom CSS

div.header-nav-folder-content {
    column-count: 4;
    width: auto !important;
}

 

Many Thanks  @tuanphan

I t works. 

However, some of the sub elements goes in the other columns !

how I can put the element in the same columns? see the attached 

and can I decrease the font size of the sub elements only?

Thanks Again

I Use this code before: 

//Stylized Folder Dropdown Menu
@linkBGColor: #cee680;
@linkTextColor: #fff;
.header-nav .header-nav-item--folder .header-nav-folder-content {
  padding: 0;
  .header-nav-folder-item {
    padding: .5em 1em;
  }
  .header-nav-folder-item:hover {
    background: @linkBGColor;
    a {
      color: @linkTextColor;
    }
  }
}

Did you solve?