Material Design Liteでドロップダウンリストを使う

Polymerにはあるのに、Material Design Liteにないもの。まぁいっぱいあるんですが、あっても良さそうなものがドロップダウンリストです。

text inputのスタイルをそのまま使えばそれっぽいものが出ます。

<div class="mdl-textfield mdl-js-textfield">
    <select class="mdl-textfield__input">
        <option>織田信長</option>
        <option>明智光秀</option>
        <option>毛利元就</option>
        <option>上杉謙信</option>
    </select>
</div>

Chromeはこんな感じ

Firefoxは横のボタンがちょっとダサい感じに

Safariだと印影が入っちゃってちょっとMaterial Designっぽくなくなっちゃいますが、とはいえ、スタイルなしよりは他のコンポーネントと大きさがそろうのでマシです。

Material Design LiteはCDNでも提供されているので、jsfiddleで試せて良い感じですね。