CODEWITHSUNDEEP
css
John
John

Reputation: 4944

Styling Text to be a fixed distance from right side of screen

I would like to style <div class="logintitle">Please login</div> to be fixed at a certain distance (maybe 300 pixels) from the right side of the screen. The CSS below sort of does it, but it also makes the "Please" appear above the "login," and it adds a hortizontal scrollbar to the bottom of the browser window. How can I do this while leaving "Please" and "login" on the same line and while not adding a hortizontal scroll bar?

Thanks in advance,

John

.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;
        }

Upvotes: 1

Views: 1689

Answers (1)

animuson
animuson

Reputation: 54757

Well that's because you set the width to 10px and the 'Please login' is separated by a space which breaks it onto a separate line. As for the horizontal scrollbar, this division alone should not cause that, there must be something else in your page interfering with it.

To fix the multi-line issue, you can either widen the width of the block or add this style:

white-space: nowrap;

Upvotes: 1

Related Questions