Wie kann ich in Materialise CSS ein Dropdown-Menü mit mehreren Spalten erstellen?

Question

Ich arbeite an einem persönlichen Projekt und aufgrund einer großen Anzahl von Elementen für das Dropdown-Menü, würde eine Multi-Spalte (2 Spalten, um genau zu sein) besser funktionieren. Wie kann ich dies in Materialise CSS erreichen?

Answer 1

Ist das ähnlich, was Sie im Sinn haben? Es braucht ein wenig benutzerdefiniertes CSS, um eine Auffüllung zu entfernen, die die Listenelemente merkwürdig erscheinen lässt, aber es zeigt zwei Drop-Spalten und rastet auf kleineren Geräten ein.

HTML

<div id="dropdown1" class="row dropdown-content"> 
    <div class="col s12 m6"> 
    <ul> 
     <li>1</li> 
     <li>2</li> 
     <li>3</li> 
    </ul> 
    </div> 
    <div class="col s12 m6"> 
    <ul> 
     <li>4</li> 
     <li>5</li> 
     <li>6</li> 
    </ul> 
    </div> 
</div> 

<nav> 
    <div class="nav-wrapper"> 
    <ul> 
     <li><a class="dropdown-button" href="#!" data-activates="dropdown1">Dropdown</a></li> 
    </ul> 
    </div> 
</nav> 

CSS

#dropdown1 div { 
    padding: 0; 
} 

#dropdown1 li { 
    text-align: center; 
} 

JSFiddle