HTML的链接部分？

它看起来像本页最底部的一个：

有没有更简单的方法来创建框并将它们并排放置

我的看起来像一个楼梯，每层往下走380px

以下是我的源代码：

    <!--External Links-->   <div id="external_links">
    <div>
        <ul style="height:380px; width:240px; max-width:240px;" id="Rowone">
        <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a></li>
        </ul>
        <ul style="height:380px; width:240px; max-width:240px;" id="Rowtwo">
        <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a></li>
        </ul>
        <ul style="height:380px; width:240px; max-width:240px;" id="Rowthree">
        <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a></li>
        </ul>
    </div>

让我们重新组织并简化您的代码。我删除了额外的

标签-这将阻止链接彼此相邻显示

<!--External Links-->   <div id="external_links">
<div>
    <ul style="height:380px;" id="Rowone">
        <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a></li>
        <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a></li>
        <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a></li>
    </ul>
</div>

---

请注意，我从您剩余的

标记中删除了宽度规则-它不够宽，不允许所有三个链接并排显示。下面是一个JSFIDLE来演示实际的代码

我想这可能就是你要找的：
（勾选此项）

---

为什么每个链接都单独包含在一个列表中而不是一个列表项中？将所有链接放在一个

ul

中并将每个链接包含在

li

中不是更有意义吗？（也不需要这两个div）是否要将它们放在一列中？还是肩并肩？（您希望在此处复制示例链接中的内容？）这是您想要的效果吗？你说得对@Sergio，对不起。每个ul中只有一个li，这让我分心。浮动或

display:inline block

可用于使ul彼此相邻。@AndrewGibson，是的，

display:inline block甚至更好。我改了：）谢谢，不过我找到了另一种方法，看看这页的底部。但是你的方式更有效，所以伊玛可以这样做，非常感谢^ ^通常有很多方法来完成相同的布局。我很高兴能帮上忙！哦还有一件事它只能显示两行。。。我想这可能是我的css问题，谢谢你^_^
li {
    display: inline-block;
}

<!--External Links-->
<div id="external_links">
<ul id="Rowone">
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
</ul>
<ul id="Rowtwo">
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
</ul>
<ul id="Rowthree">
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
    <li><a href="http://www.andymark.com/" title="AndyMarks - Distributor"><h3>Andy Mark</h3></a>
    </li>
</ul>

#external_links ul {
display: inline-block;
height:380px;
width:140px;
max-width:240px;
}
#external_links ul li {
list-style:none;
line-height: 0px;
}