html - 同じ行に Div を作成してください

Question

このアイコンページを作るのに苦労しました。基本的にはアイコン同士を近くに並べたいので基本的にはこんな感じで・・・

カスタム アイコン - 鉛筆 カスタム アイコン - 時計 鉛筆のアイコン 時計のアイコン

<div>
    <!-- Icon Button - pencil -->
    Custom Icon - pencil <br />
    <div id="pencil">pencil</div>
</div>

<div>
    <!-- Icon Button - clock -->
    Custom Icon - clock <br />
    <div id="clock">clock</div>
</div>

<div>
    <!-- Icon Button - disk -->
    Custom Icon - disk <br />
    <div id="disk">disk</div>
</div>

<div>
    <!-- Icon Button - calendar -->
    Custom Icon - calendar <br />
    <div id="calendar">calendar</div>
</div>

<div>
    <!-- Icon Button - zoomin -->
    Custom Icon - zoomin <br />
    <div id="zoomin">zoomin</div>
</div>

<div>
    <!-- Icon Button - zoomout -->
    Custom Icon - zoomout <br />
    <div id="zoomout">zoomout</div>
</div>

スタッフ用のページに表示したい、膨大な数の既製のボタンがあります:)