Question

我目前正在为一个网站工作，在他们的页面上，他们希望在那里有一些推荐。他们希望每个小句子显示在屏幕右侧自己的框内。我已将他们请求的文本放在页面顶部，并在其中插入了引号。这是我遇到问题的地方。无论我做什么，无论是漂浮还是显示，我都无法让盒子沿着页面的一侧垂直运行，每一个都显示在前一个框架的下方。有人可以帮我完成这项工作。我试图漂浮块无济于事。他们只想堆在一起。这是代码：

HTML

<aside id="expert">
     <h2>Always a Satisfied Customer</h2>

    <ul class="b">
        <li>Upfront Pricing</li>
        <li>Affordable Rates</li>
        <li>Courteous and Respectful</li>
        <li>Always On Time</li>
    </ul>
</aside>

<aside id="refer">
    <p>I would recommend EJP to anyone and everyone! They showed up, looked at my issue, and fixed it promptly. They are simply the best!
        <br />-Tim S.</p>
</aside>

CSS

#expert {
    background-color: white;
    display: block;
    border: solid;
    float: right;
    right: 20px;
}
#refer {
    background-color: white;
    border: solid;
    float: right;
    width: 150px;
    display: block;
}

谢谢

Answer 1

您可以将它们堆叠起来：

#refer {
    ...
    float: right;
    clear: right;
}

<强> Demo

在屏幕右侧显示多个框

1 个答案: