9.1 #Dropdown.default Default Dropdown

Toggle example guides Toggle HTML markup

.sf-dropdown

Pages
Blogs14
News items0
Pages
Blogs
News items
Blog posts
Pages
Lists
Restaurants
Html
    <div class="sf-dropdown" style="vertical-align:top;">
        <div class="sf-dropdown__item -active">
            Pages
        </div>
        <div class="sf-dropdown__item -disabled">
             Blogs<span class="sf-dropdown__counter -positive">14</span>
        </div>
        <div class="sf-dropdown__item">
             News items<span class="sf-dropdown__counter -neutral">0</span>
        </div>
    </div>
    <div class="sf-dropdown" style="vertical-align:top;">
        <div class="sf-dropdown__heading">
             Pages
        </div>
        <div class="sf-dropdown__item">
             Blogs
        </div>
        <div class="sf-dropdown__separator">
        </div>
        <div class="sf-dropdown__item">
             News items
        </div>
        <div class="sf-dropdown__item ">
             Blog posts
        </div>
        <div class="sf-dropdown__separator">
        </div>
        <div class="sf-dropdown__heading">
             Pages
        </div>
        <div class="sf-dropdown__item">
             Lists
        </div>
        <div class="sf-dropdown__item">
            Restaurants
        </div>
    </div>