css - 将文本样式设置为与屏幕右侧的固定距离

Question

我想设计 <div class="logintitle">Please login</div>固定在距屏幕右侧一定距离(可能是 300 像素)处。下面的 CSS 可以做到这一点，但它还使“请”出现在“登录”上方，并在浏览器窗口的底部添加了一个水平滚动条。如何在将“请”和“登录”留在同一行而不添加水平滚动条的情况下执行此操作？

提前致谢

约翰

.logintitle
        {
        position:absolute;
        width:10px;
        right:300px;
        top:2px;
        text-align: left;
        margin-bottom:3px;
        padding:0px;
        font-family:Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #000000;
        }

Answer 1

那是因为您将宽度设置为 10px，并且“请登录”由一个空格分隔，该空格将其分成单独的一行。至于水平滚动条，光是这个划分不应该造成这种情况，一定是你的页面中有其他东西干扰了它。

要解决多行问题，您可以加宽 block 的宽度或添加此样式:

white-space: nowrap;