單位相對於元素的寬度或高度

Question

我總是有這個疑問。

當我們使用，例如，width: 50%，這50％是相對於其父母的寬度。

例如i具有此代碼

<div id="root"> 
    <div id="child"> 

    </div> 

    <div id="child2"> 

    </div> 
</div> 

和此CSS

#root{ 
    width: 200px; 
    height: 100px; 
    background-color: red; 
} 

#child{ 
    width: 50%; 
    height: 20px; 
    background: yellow; 
} 

#child2{ 
    width: 50px; 
    height: 20px; 
    background: green; 
} 

http://jsfiddle.net/3EKzj/

如果#root具有200像素的寬度，#child具有100像素的寬度...

但有可能的寬度#child是使用任何css屬性或函數的#child2（25px）寬度的50％？

我知道在transform: translate(50%,25%) 50％是相對於自己的寬度元素和25％的自身高度元素，所以有可能用任何函數我可以得到其他元素的寬度或高度？

謝謝！

Answer 1

不是沒有JavaScript。 CSS無法通過繼承將一個元素的屬性應用於另一個元素。

更新
使用JavaScript，解決方法是這樣的：

var child = document.getElementById('child'); 
var child2 = document.getElementById('child2'); 

child.style.width = (child2.clientWidth/2) + 'px';