Firefoxのパーセンテージ幅でFlexboxが動作しない

Question

私は単純なサイドバーをアーカイブしようとしました。コンテンツを視覚的に通常の浮動小数点で視覚的に表示してから、（margin-bottom: -99999px; padding-bottom: 99999pxなど）と等しい高さの列の古典的なテクニックを使用しましたが、私はそれが好きではなかったので、ここでそこにいくつかの問題があったので、それはしばらく前に固定サイズの幅で、それはうまくいきましたが、今私はパーセンテージの幅を持っているので、Firefoxはそれをまったく気に入らなかったようです...

This例は、そして、それはSafariとChromeの罰金でしたが、Firefoxはちょうどパーセント幅を無視...

は、その後、私はで何か differentを試してみました...私は、Firefoxの it is a known issueことがわかったが、それは古いものであると私は、彼らはすでにそれを解決したと思いましたファイアフォックスを騙そうとするが、それでもコンテンツに基づいてサイドバーのサイズがページごとに異なるため、私は期待したくありませんでした。

フレキシブルなレイアウトでフレックスボックスをあきらめて、私のニーズに合ったもっとシンプルなものを使いましょう。 ..

しかし、私は誰もが任意の回避策でこの問題を解決するかどうかを知るために興味または私たちは、このためにキュー内のすべてのであればモジラで固定されるように...

ありがとう！

Answer 1

回避策を避けることを強くお勧めします。margin-bottom: -99999px; padding-bottom: 99999px回避策 流体レイアウト（14％、86％の分割）を使用する場合は、Flexではなく古い普通のCSSを使用してください。

http://jsfiddle.net/97dtV/7/

なぜホイールを再発明します。サイトをレイアウトするためのより良い方法を探している場合は、「グリッド」アプローチを試してみてください。

• セマンティックグリッド（http://semantic.gs/）
• ブートストラップ - （http://twitter.github.com/bootstrap/index.html）

これはあなたのことを前提としていあなたがそれを無視するならば、ある特定の理由のためにflexを必要としません;）。 CSS3固有の属性を使用している場合は、後方互換性も考慮してください。