Menu

A menu

A vertical menu displays elements vertically.

A vertical menu's width defaults to an arbitrary size. To have it fit your content more precisely use the fluid variation in conjunction with ui grid.

A pagination menu is specially formatted to present links to pages of content

1

...

10 11 12

A message can be formatted to show tabs of information

A tiered menu can show the sub-sections available as part of an activated section.

A secondary menu has more subtle formatting, ideal for showing the sections of content on a page.

A menu can point to content to show relationship

A menu can display simple text links

A menu may have a header to help label sections of a menu.

A menu may have a simple text item.

Single paragraphs are automatically formatted as text. You can also specify an item as textual by adding the classname text

A menu item can contain an input inside of it

A menu item can contain a button inside of it

A menu may contain a link item, or an item formatted as if it is a link.

Items that are anchor tags will automatically be formatted as a link.

An item may contain a nested menu in a dropdown.

Dropdowns use UI dropdown elements. To have a dropdown open without javascript, use the simple variation

A menu may contain another menu group in the same level as menu items.

A menu item may contain another menu nested inside that acts as a grouped sub-menu.

A menu item can be hovered

Menu items are only hoverable if they are links, defined with the variant "link", or are given the class name hover programmatically.

A menu item can be pressed in

A menu item can be active

A menu may have its colors inverted to show greater contrast

Additional colors can be specified.

A menu may have just icons

A menu may have labeled icons

A vertical menu may take the size of its container. (A horizontal menu does this by default)

A menu may divide its items evenly

A vertical menu can point to content adjacent to itself to show ownership

A menu may be attached to other content segments

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.

A horizontal menu can vary in size

A vertical menu can also vary in size

A menu item or menu can remove element padding, vertically or horizontally

A menu item or menu can have no borders

Previous 1 2 3 4 5 6 Next

Types

Menu

Vertical Menu

Pagination

Tabular

Tiered Menu

Vertical Menu w/ Sub Menus

Secondary Menu

Pointing

Text

Elements

Header Item

Text Item

Input

Button

Link Item

Dropdown Item

Menu

Nested Menu

States

Hover

Down

Active

Variations

Menu

Inverted

Colors

Icons

Icons

Fluid

Evenly sized items

Attached

Horizontal Sizes

Items

Fitted

Borderless