How to format select box with Material Design Lite?

by

This worked pretty well for me (using fuel as an example):

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
<script src="https://code.getmdl.io/1.3.0/material.min.js"></script>
      <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
        <select class="mdl-textfield__input" id="octane" name="octane">
          <option></option>
          <option value="85">85</option>
          <option value="87">87</option>
          <option value="89">89</option>
          <option value="91">91</option>
          <option value="diesel">Diesel</option>
        </select>
        <label class="mdl-textfield__label" for="octane">Octane</label>
      </div>

No libraries or anything needed just the standard MDL CSS and JavaScript.

Leave a Comment