Select

Examples

<label for="s1" class="label">Select</label>
<select class="select" id="s1">
  <option value="Banana" selected="selected">Banana</option>
  <option value="Ananas">Ananas</option>
  <option value="Papaya">Papaya</option>
  <option value="Kiwi">Kiwi</option>
</select>

    

Introduction

The Groundhog select component visually enhances the standard html <select> element. The select usually holds a list of elements that can be expanded.

Including a select

1. To include a Groundhog select add a <select> element. Include the necessary <options>.

   <select>
   <option>
   </option>
   </select>
   

2. Add the necessary Groundhog classes and values to the elements.

   <select class="select">
   <option value="Banana">
   </option>
   </select>
   

3. Add a label to the select (optional) and the appropriate ids.

   <label for="s1" class="label">Label</label>
   <select class="select" id="s1">
   <option value="Banana">
   </option>
   </select>
   

Available mixins for select