位置オフセットにCSS変数を使用する

Question

色を宣言するためのネイティブCSS変数については読んでいますが、top：leftの位置に変数を作成する方法があるのでしょうか？画像にテキストボックスをオーバーレイするCSSテンプレートがあり、レイアウトページはデザイナーによって定期的に変更されます。

:root { 
    --topOffset: 10px; 
    -- leftOffset: 20px; 
} 

.text_Date_Overlay { 
position: absolute; 
top: 516px + topOffset; 
left:570px + leftOffset; 
font-family:Verdana; 
font-size:18px; 
font-style:italic; 

}

はJavaScriptに行く途中、他の感謝があります：私はこのような何かを達成したいのですが？

おかげ

Answer 1

あなたはcalc()でそれらを組み合わせて、このような何かを行うことができます。

:root { 
    --topOffset: 10px; 
    --leftOffset: 20px; 
} 

.text_Date_Overlay { 
    position: absolute; 
    top: calc(516px + var(--topOffset)); 
    left: calc(570px + var(--leftOffset)); 
    font-family:Verdana; 
    font-size:18px; 
    font-style:italic; 
} 

View Example Fiddle