問題タブ [calc]

2 つの異なるレコードの数を選択し、一方の結果を他方の結果から差し引いて結果を として表示する計算を実行する MS クエリがありますdifference。

下記参照：

私が望むのは、結果が正の数であるか負の数であるかに応じて、結果を単一の値として表示することです。次のようなものです。

誰でも助けてもらえますか？

CSScalcメソッドは、Opera mini と IE 8 ではサポートされていません。しかし、これは非常に重要なメソッドであるため、これらのブラウザーに相当するものが存在しないとは思えません。

パディングがあるだけでなく、画面全体を埋める div を達成できる普遍的にサポートされている方法はありますか? または、このコードをクロスブラウザーにする方法はありますか?

html

CSS

フィドル: http://jsfiddle.net/wfq6xLn5/

calcテーブルのセルの幅を指定するために使用しています。これは Chrome では機能しますが、他のブラウザーでは機能しません。

Caniuse は、他のブラウザーでのcalc に関する問題については言及していません。

HTML:

CSS（私はSassを使用していますが）：

ご覧のとおり、IE11 はすべてのセルを同じ幅に解決します。

ここに CodePen があります。

検索入力を表示し、フィルターのオプションを選択し、ボタンを1行で送信するレスポンシブ検索バーの特定の外観を実現しようとしています。送信ボタンと選択の幅はそれぞれ 44px と 110px に定義されており、検索入力フィールドを使用可能な残りのスペースに配置したいので、 を使用しますwidth: calc(100% - 154px);。しかし、意図したとおりに機能していません。ここで例を参照してください https://jsfiddle.net/t97fqqxu/

HTML:

CSS

編集:ブートストラップ 3 のボックス モデルを利用しているため、マージンとパディングはありません。幅は常に 44px と 110px になります。

CSS calc() を使用して、下部にフッターがある App Style レイアウトを構築しようとしています。

主な CSS プレーヤー:

HTML の概要は次のとおりです。

ここで完全な例を表示してください: http://codepen.io/woocas/pen/MwyBGd?editors=110

.right div (黄色のもの) のオーバーフローが .content-container の高さになるようにしようとしています。

しかし、例でわかるように、スクロールバーは content-container によって割り当てられたスペースを超えています。フッターの裏です。

どんな助けでも大歓迎です。