Positioning elements at top right of <div>

css, html, layout

Solution

If you use absolute positioning, you can simply use `top` and `right` to position the button relative to the top right corner.

#myButton {
    position: absolute;
    top: 0;
    right: 0;
}

jsFiddle Demo

Please note that when absolutely positioned, the element is taken out of the flow, so other elements (like that `<p>` there) can go "under" it if they are big enough.

Problem

I have a Fiddle that contains a div, some text and a button. I'd like to position the button on the top right of the div no matter how big the div gets, or how much text is in the div. I though something like ``` float: right; position: relative; ``` may do the trick, but this doesn't work, because the 'text' in the div will push the button down. Is there a better way to do this? Maybe `absolute`ly position the button to the top right, instead of `relative`?

Original source