Atomic Package CSS Style Guide

Select: Size Variation 

<p class="input">
    <select name="" class="narrow">
        <option value="">1</option>
        <option value="">2</option>
        <option value="">3</option>
        <option value="">4</option>
        <option value="">5</option>
    </select>
</p>

<br><br>

<p class="input">
    <select name="" class="short">
        <option value="">1</option>
        <option value="">2</option>
        <option value="">3</option>
        <option value="">4</option>
        <option value="">5</option>
    </select>
</p>

<br><br>

<p class="input">
    <select name="">
        <option value="">1</option>
        <option value="">2</option>
        <option value="">3</option>
        <option value="">4</option>
        <option value="">5</option>
    </select>
</p>

<br><br>

<p class="input">
    <select name="" class="long">
        <option value="">1</option>
        <option value="">2</option>
        <option value="">3</option>
        <option value="">4</option>
        <option value="">5</option>
    </select>
</p>

<br><br>

<p class="input">
    <select name="" class="wide">
        <option value="">1</option>
        <option value="">2</option>
        <option value="">3</option>
        <option value="">4</option>
        <option value="">5</option>
    </select>
</p>
 
<p class="input">
  <select name="" class="narrow">
    <option value="">1</option>
    <option value="">2</option>
    <option value="">3</option>
    <option value="">4</option>
    <option value="">5</option>
  </select>
</p>

<br><br>

<p class="input">
  <select name="" class="short">
    <option value="">1</option>
    <option value="">2</option>
    <option value="">3</option>
    <option value="">4</option>
    <option value="">5</option>
  </select>
</p>

<br><br>

<p class="input">
  <select name="">
    <option value="">1</option>
    <option value="">2</option>
    <option value="">3</option>
    <option value="">4</option>
    <option value="">5</option>
  </select>
</p>

<br><br>

<p class="input">
  <select name="" class="long">
    <option value="">1</option>
    <option value="">2</option>
    <option value="">3</option>
    <option value="">4</option>
    <option value="">5</option>
  </select>
</p>

<br><br>

<p class="input">
  <select name="" class="wide">
    <option value="">1</option>
    <option value="">2</option>
    <option value="">3</option>
    <option value="">4</option>
    <option value="">5</option>
  </select>
</p>
 
/* No context defined. */

No notes defined.