Dynamic DIV box height with center position of the child DIV.

Answer 1

Not really sure where you're going with this. But it seems you want to just have padding around the inner div?

<div style="background-color: yellow; width: 100px; 
            position: relative; padding: 8px">
<div style="background-color: gray;">Hello</div>

This way, the content of the inner div will alter the height of the outer div...

Answer 2

If you have only absolute position object[s] in Relative position object, you must fix height value of Relative position object.

Hint. You can change height value via javascript or define min-height(CSS 2+) property of relative position object.

Answer 3

Is width 'W' known? Ah, it is somewhat irrelevant...

OK, you need to do something like this (assuming you position the outer div where you want it). :

<div style="float:left; background-color:yellow; width:100px;">
     <div style="background-color:gray; margin:8px;">You need enough content here to push the width out far enough...</div>
</div>

You may need to place the outside div in a further outside div to get the positioning correct, but the outside div must have a the float variable (left or right - it doesn't matter).

You can add borders and padding etc to these divs to suit. The key to the whole process is the float value existing in the outer div.