Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Div
classfl-col-mixed-100
Wiki Markup
{div2:class=fl-col-fixed fl-force-left}
{include:FSS advanced layout examples navigation}
{div2}

{div2:class=fl-col-flex}
h2. Menus
The "menus" classes will convert an unordered list into a vertical menu. The implementor must  programmatically respond to user input, including programmatically moving the {{fl-activement}} class on the currently active tab. The examples on this page are not functional in that sense.

{html}
<div class="menu-demos">
<div class="fl-container-200 fl-centered">
    <ul class="fl-listmenulist-menu">
        <li><a href="#_bottom">Menu item #1</a></li>
        <li class="fl-activemenu"><a href="#_bottom">Active Menu item</a></li>
        <li><a href="#_bottom">Menu item #3</a></li>
        <li><a href="#_bottom">Menu item #4</a></li>
        <li><a href="#_bottom">Menu item #5</a></li>
    </ul>
</div>
</div>
{html}

The mark-up and classes used to produce this layout:
{code:html}
<div class="fl-container-200 fl-centered">
    <ul class="fl-list-listmenumenu">
        <li><a href="#_bottom">Menu item #1</a></li>
        <li class="fl-activemenu"><a href="#_bottom">Active Menu item</a></li>
        <li><a href="#_bottom">Menu item #3</a></li>
        <li><a href="#_bottom">Menu item #4</a></li>
        <li><a href="#_bottom">Menu item #5</a></li>
    </ul>
</div>
{code}

{div2}