请在同一行创建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>

我想在工作人员的页面上显示大量预制按钮：）

Answer 1

我很难理解你正在寻找什么，但我可以提供一些一般性的指示。如果您有div并且想要将它们水平排列，那么最常见的方法是在CSS中使用float。

Here's a fiddle

这里发生了什么？我做了3个div，他们排成一列。我给他们每人两节课。它们都有类icon，它控制着所有三个行为。然后每个人都有第二个类来定义他们的个人行为。其中还有文字，用于演示如何用其他内容填充这些div。

排列它们的重要一点是它们都是float: left并且它们都有一组width。设置宽度可能对您的布局很重要，除非内容都具有特定的宽度 - 在这种情况下，您可能只是使用padding而感到高兴。

如果我完全忽略了你的观点，试着澄清一下，我会再给它一次。