css - 内側の DIV 幅を、auto に設定されている外側の div 幅のパーセントにする方法

Question

Wapper には、外側の DIV (IMG を含むグループ DIV) と 3 つの内側の DIV (オーバーレイ) が含まれています。コンテナーに相対的なオーバーレイ DIV の位置とサイズを調整する必要があります。問題は、コンテナーの幅が auto に設定されていることです。so DIVa を width に設定すると、外側の DIV の幅が auto に設定されるため、ユーザーがウィンドウのサイズを変更すると、それに応じてサイズが変更されます。

JFIDDLE バージョンは次のとおりです: http://jsfiddle.net/6XsVB/

This is what I get: (it's using the % of the main wrapper. Not the parent DIV)
    +-------------------------------------------------------------------------+
    |  +--------------------------------------------------------+             |
    |  | Group DIV. Height:100%; Width:auto; (contains IMG)     |             |
    |  | +---------------++------------------------------++-----|------------+| This is
    |  | |               ||                              ||     |            || the main 
    |  | |               ||                              ||     |            || wrapper
    |  | |    overlay1   ||          overlay2            ||    overlay3      || DIV 
    |  | |               ||                              ||     |            || Width:1200px 
    |  | |     DIV a     ||            DIV b             ||     |DIV c       || Height:70%  
    |  | |               ||                              ||     |            ||   
    |  | |   Width:20%;  ||        Width:50%;            ||   Width:30%;     || The width of 
    |  | |  Height:100%  ||        Height:100%;          ||   Height:100%;   || this wrapper 
    |  | |               ||                              ||     |            || will change 
    |  | |               ||                              ||     |            || depending on
    |  | |               ||                              ||     |            || the amt of 
    |  | |               ||                              ||     |            || groups used
    |  | +---------------++------------------------------++-----|------------+| inside it 
    |  +--------------------------------------------------------+             | manually.  
    +-------------------------------------------------------------------------+

This is the goal:
    +--------------------------------------------------------------------------+
    |  +--------------------------------------------------------+              |
    |  | Group DIV. Height:100%; Width:auto; (contains IMG)     |              |
    |  | +-----------++------------------------++-------------+ | This is      |
    |  | |           ||                        ||             | | the main     |
    |  | |           ||                        ||             | | wrapper      |
    |  | |  overlay1 ||       overlay2         ||  overlay3   | | DIV          |
    |  | |           ||                        ||             | | Width:1200px |
    |  | |   DIV a   ||         DIV b          ||    DIV c    | | Height:70%   |
    |  | |           ||                        ||             | |              |
    |  | | Width:20%;||     Width:50%;         || Width:30%;  | | The width of |
    |  | |Height:100%||     Height:100%;       || Height:100%;| | this wrapper |
    |  | |           ||                        ||             | | will change  |
    |  | |           ||                        ||             | | depending on |
    |  | |           ||                        ||             | | the amt of   |
    |  | |           ||                        ||             | | groups used  |
    |  | +-----------++------------------------++-------------+ | inside it    |
    |  +--------------------------------------------------------+ manually.    |
    +--------------------------------------------------------------------------+

注: 幅を auto bc に設定する必要があります。ブラウザー ウィンドウのサイズが変更されたときに、画像のサイズを変更する必要があります。