CSS divs：display：table alternative？ここで

Question

<div id="wr"> 
    <div id="con"> 
     <div id="unknownWidth">some box with unknown width</div> 
    </div> 
    <div id="knownWidth"></div> 
</div> 

#wr { 
    width:300px; 
    height:100px; 
    border:1px solid red; 
    margin:50px; 
} 
#knownWidth { 
    width:100px; 
    height:30px; 
    margin:0px auto;  
    border:1px solid gray; 
} 
#unknownWidth{ 
    height:30px; 
    margin:0px auto;  
    border:1px solid blue; 
} 

はいじるするためのリンクです： http://jsfiddle.net/7EsMR/

はそれが#unknownWidthボックスにdisplay:tableを使用して回避し、それが提供していますと同じ機能を維持することは可能ですか？

IE7では動作する必要がありますが、IE6では動作しません。 ：D

必要な結果： http://jsfiddle.net/7EsMR/1/

おかげで、あなたはラップの子とtext-align: centerにdisplay: inlineの組み合わせを使用することができます）

Answer 1

：

http://jsfiddle.net/3snzb/2/

Answer 2

の組み合わせdisplay:inline + text-align:centerトリックを行う可能性があります：

http://jsfiddle.net/kG846/2/

Answer 3

私はあなたが行うことができると思います：インラインブロックが支持されているので

#wr { 
    width:300px; 
    height:100px; 
    border:1px solid red; 
    margin:50px; 
    text-align: center; 
} 
#knownWidth { 
    width:100px; 
    height:30px; 
    margin:0px auto;  
    border:1px solid gray; 
} 
#unknownWidth{ 
    display:inline-block; 
    height:30px; 
    border:1px solid blue; 
} 

はIE7で動作するはずです。