Jump to content

multiple columns in the drop down navigation menu

Recommended Posts

  • Replies 4
  • Views 713
  • Created
  • Last Reply
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


Screen Shot 2020-12-06 at 15.24.44.png

Link to comment

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;


Link to comment


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.