Sciter CSS 'flow'属性のブラウザの代替方法

Question

最近、私はSciterで遊んでいて、信じられないほど便利なflow CSS属性を発見しました。ドキュメントには、Sciterの機能としてリストアップし、this articleにリンクすることで、ほとんど言及していません。

明らかに、これはブラウザでは機能しませんし、対象に関する詳細を見つけることはむしろ困難です。

この機能はすばらしいレイアウトを素早く簡単に作成するのに非常に役立ちます。そのため、ブラウザで動作するようなものに非常に興味があります。

1. が、私は似たものを使用することができます（例えば、標準のCSSを使用して）一般的なブラウザで：

   は基本的に私は2つの質問がありますか？何とか？

2. （主に空想的な好奇心を満たすため）この拡張機能はSciter以外のものでも使用されていますか？サイトからの例を使用して

Answer 1

：

あなたがこれを行うことができますが（背景は目的を観察するための追加：

p { 
 
    margin-left: calc((100% - 40%)/(2 + 1) * 2); 
 
    margin-right: calc((100% - 40%)/(2 + 1) * 1); 
 
    background-color: #fdfcc1; 
 
}

<p>... some text ...</p>

をあなたはそれを実装しますどんな値でもこのように：

p { 
    margin-left: calc((100% - ELEMENT_WIDTH)/(FLEX_VALUE_LEFT + FLEX_VALUE_RIGHT) * FLEX_VALUE_LEFT); 
    margin-right: calc((100% - ELEMENT_WIDTH)/(FLEX_VALUE_LEFT + FLEX_VALUE_RIGHT) * FLEX_VALUE_RIGHT); 
} 

それとも、SCSSを使用している場合、あなたはこのような何かを行うことができます：

$elem-width: 40%; 
$flex-left: 2; 
$flex-right: 1; 

p { 
    margin-left: calc((100% - $elem-width)/($flex-left + $flex-right) * $flex-left); 
    margin-right: calc((100% - $elem-width)/($flex-left + $flex-right) * $flex-right); 
}