How to absolutely position dynamic .js script in container and deallocate its space for use by next div

for example lets say i have the html

<div id="container">

<开发者_开发知识库div id="js-widget">
<script src"xxxyyyzzz" type="text/javascript"></script> 
</div>


<div id=something-else1"></div>
<div id=something-else2"></div>

</div>

what i need is js-widget to float right and something-else1 and something-else2 to start at js-widget's original position on the left.

right now what ive been doing is placing the script as the last object on the page and relatively positioning it, but i know there has to be a better solution. thanks!

EDIT: 1 last constraint:

doing position:absolute;right0px; wont work because the last "something-else" div, is a bunch of text and the widget sometimes overlaps it. if i position it absolutely, even if i add padding to the widget, the text will always run over the widget.

Use position:absolute;right:0px; for the js-widget.

The position:absolute will remove the element from the normal flow, and so the following elements will take up its space.

After Update

Have a look for the options at an example i made at http://www.jsfiddle.net/gY6uz/1/

For absolute positioned widget, you need to put padding on its container, not itslef...

For floated widget, it should not interfere with the following divs, unless they are floated themselves as well..