htmlのwidth属性を計算する方法はありますか？

Question

HTML 幅属性で計算できるかどうか疑問に思っていました。次のようなもの：

<SVG width="100%-10px"> 

またはこれに対応するCSS回避策？

Answer 1

私は、あなたが探しているものは一例CSS計算値（）関数ここhttp://www.w3schools.com/cssref/func_calc.asp

されると思いますが、このような+などの数学的な表現を使用することができます

width: calc(100% - 10px); - */

Answer 2

calc()このためだけで正常に動作：

svg { 
 
    background-color: red; 
 
    width: calc(100% - 200px); 
 
}

<svg></svg>

Answer 3

@Hunterが示唆したように、あなたがcalc()を使用することができますが、私はので、それに対して助言する：、レイアウトは持っているかもしれCALC（）式を使用して

によりブラウザが丸めは異なるサブピクセルを処理する方法に予期せぬ結果。

ソース：それはすべてのブラウザで同じように見えるすべてのものを確実にするためにそのダイナミックなければならない場合http://caniuse.com/#feat=calcは

だけで、JavaScriptを使用します。

HTML：

<div class="parent"> 
    <svg class="dynamic-width"></svg> 
</div> 

JS：OPは `、IE 8、またはOpera Miniのを支援する、計算値の乗算や除算（古いAndroidのバージョンではサポートされません）を使用して計画されて

var parent = document.getElementsByClassName('parent')[0]; 
var pixelsToSubtract = 10; 
var svg = document.getElementsByClassName('dynamic-width')[0]; 
svg.style.width = parent.getBoundingClientRect().width - 10 + 'px';