"Right" way to tell relatively shifted div that the original place no longer occupied

Question

As long as I see when I position an element (for example flash player) relatively to previously placed image as in the example

style="display: block; width:216px;height:164px; position: relative; top: -306px; left: 63px"

the place that it intended to use before is looked occupied, i.e. next element will be shown AFTER that place. But I need to tell the rendered that I no longer need this place and that the next element can be rendered as if the relatively placed element didn't appear at all.

The only solution I found is to wrap the content in an external div with with the dimensions of the main image and "overflow: hidden"

Is there a better (or "right" as in the title) way to do the same?

Answer 1

A relatively positioned box keeps its normal flow size, including line breaks and the space originally reserved for it.

Relative positioning

One way is to place the child element as absolutely positioned inside another container with position set.

Answer 2

You use absolute positioning instead of relative positionning to get the element out of the flow.

If you still want to specify the coordinates relative to a position in the document, you put another element around it. By setting relative positioning (but no offset) on the surrounding element you turn it into a layer, so that the absolutely positioned element uses that as origin instead of the page.

Example:

<div style="position:relative;">
   <div style="position:absolute;top:-306px;left:63px;">content...</div>
</div>