html - 想将文本并排放在 DIV 中

Question

我希望通过类似的编码在 DIV 中实现上述目标：

<div id="container3" style="position: relative;">
    <div id="left" style="position: absolute; padding-left: 10px;">
        About Company<br>Our Team<br>Careers
    </div>
</div>

将包含所有文本的父 DIV 的 CSS：

#container3 {
    vertical align: top;
    width: 80%;
    height: 150px;
    background-color: #ffffff;
}

Answer 1

也许与此类似：

HTML：

<ul class="footer">
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
    <li class="link">
        Link
    </li>
</ul>

CSS：

.footer{
    background-color:#000000;
    padding-left:5px;
}

.link{
    color:#ffffff;
    list-style:none;
    display:inline-block;
    width:200px;
    text-align:left;
}

演示

Alternate Solution：http: //jsfiddle.net/xU76e/1/

HTML：

<div class="footer">
    <ul class="footer-links">
        <li class="link">
            Link
        </li>
        <li class="link">
            Link
        </li>
        <li class="link">
            Link
        </li>
        <li class="link">
            Link
        </li>
    </ul>
    <ul class="footer-links">
        <li class="link">
            Link
        </li>
        <li class="link">
            Link
        </li>
        <li class="link">
            Link
        </li>
        <li class="link">
            Link
        </li>
    </ul>
    <ul class="footer-links">
        <li class="link">
            Link
        </li>
        <li class="link">
            Link
        </li>
    </ul>
</div>

CSS：

.footer{
    background-color:#000000;
    overflow:auto;
}

.footer-links{
    padding-left:5px;
    float:left;
    padding:0px 20px;
    list-style:none;
}

.link{
    color:#ffffff;
}

Answer 2

你可以试试：

#container3 > div {
float: left;
padding-left: 10px;
/* any additional styling */
}