Fixed width div pushes floated text off the screen

Question

jsfiddle: http://jsfiddle.net/4wayP/

<div style="position:fixed;width:100%;">
    <p style="float:right;">Hello World</p>
</div>

What gives? Is there a clean way to ensure this doesn't happen? Or is it just margin-right til it looks acceptable.

Answer 1

Don't forget to specify top: 0; left: 0 top: 0; left: 0 .

jsFiddle Demo

Otherwise it will be placed whereever it would be if it had position: static . In your case, the body has default margin, so it would be placed according to that margin.

This fiddle will help illustrate what happened actually.