css - すべてのデータがロードされるまでラッパーは展開されません

Question

この画像では、赤の #container1 とその子 #container2 でラベルを付けました。#container2 には、青色でラベル付けされた 3 つの列 div があります。

外部アプリ (addThis、Facebook、Adsense) の読み込みが遅れたため、両方のコンテナーが展開されなかった瞬間にこのスナップショットを撮りました。その後、両方のコンテナーが期待どおりに展開されます。とにかく、 #container2 が展開される前に、常に写真 (col2) と col1 が表示されます。(わずかな秒の遅れですが、存在します)

#container1{
text-align:center;
width:926px; 
padding:15px; margin-left:12px; 
margin-bottom:10px; 
border:thin solid #999; 
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:20px;
box-shadow: inset 0 0 15px #CCC;
-moz-box-shadow: inset 0 0 15px #CCC;
-webkit-box-shadow: inset 0 0 15px #CCC; 
min-heigt:950px
}



#container2 {
width: 980px;
text-align:left; /* reset text alignment */ 
margin:0 auto; 
position:relative; 
background-color:white;
border: thin solid #999;/*#69c7e8;*/
border-top:none;
box-shadow: 0px 5px 8px #CCC, -5px 5px 8px #CCC, 5px 5px 8px #CCC;
-moz-box-shadow: 0px 5px 8px #CCC, -5px 5px 8px #CCC, 5px 5px 8px #CCC;
-webkit-box-shadow: 0px 5px 8px #CCC, -5px 5px 8px #CCC, 5px 5px 8px #CCC;
min-height:1000px;
}

#col_1{
float:left;
width:200px; 
margin-left:0;
text-align:left; 
}

#col_2{
float:left; 
width:566px;
text-align:left;  
}

#col_3{
float:right;
width:160px; 
margin-right:0;
text-align:left; }

図でわかるように、#container1 はすぐに min-height 値に拡張されますが、#container2 はそうではありません。とにかく、min-height を使用したこのパッチは好きではありません。

コンテンツが表示されると同時に両方のコンテナを展開することはできますか?