ChromeのメディアクエリのCSS変数は？

Question

Chromeはメディアクエリ内のCSS変数をサポートしていませんか？

Iは、以下のCSSを有する：クロム50及びクロムカナリア（52）の両方において

:root { 
--threshold-lg: 1200px; 
--threshold-md: 992px; 
--threshold-sm: 768px; 
--sidebar-margins: 10px; 
} 

@media(min-width: var(--threshold-sm)) { 
    .sidebar { 
    top: var(--sidebar-margins); 
    bottom: var(--sidebar-margins); 
    } 
} 

を、私は余白調整を見ません。 Safari 9.1では、期待どおりに動作します。問題を持っているだけで、メディアクエリーの条件であると思われるこのテストに基づいて

Answer 1

:root { 
 
--threshold-lg: 1200px; 
 
--threshold-md: 992px; 
 
--threshold-sm: 768px; 
 
--sidebar-margins: 10px; 
 
} 
 

 
body { 
 
    background-color: pink; 
 
} 
 
@media(min-width: 300px) { 
 
    .sidebar { 
 
    position: absolute; 
 
    top: var(--sidebar-margins); 
 
    bottom: var(--sidebar-margins); 
 
    background-color: tan; 
 
    } 
 
}

<div class="sidebar">sidebar</div>

。

Answer 2

悲しいことに、@mediaクエリでCSS変数を使用することはできません。詳細は質問hereの上の答えを参照してください。 （私は方法を知っていて、アクセスしていれば、これらの2つの質問に重複してフラグを立てるだろう）