CSSフレックスプロパティは、私が（グローバルスタイルシートで）次のCSSスタイルを持っているアンギュラ4

Question

では動作しません：プレーンHTMLファイルで

#container { 
    align-items: stretch; 
    display: flex; 
    flex: 1; 
    margin: 1rem auto; 
    max-width: 64rem; 
    width: 100%; 
} 

、コンテナは、ウィンドウの完全な高さを使用しています。 私のAngular 4プロジェクトでは、flexプロパティは文字どおり効果がありません。どうしてこんなことに？そして私はこれをどのように解決することができますか？ jsfiddle

これは、それがどのように動作するかを示します。ここでは

はJSFiddleです。しかし、私がHTMLテンプレートを角（特定のCSSをのcomponent.cssファイルに分割し、グローバルスタイルシートに対して#containerのようなグローバルスタイルを移動すると、それはもはや機能しません）。コンテナは幅全体を埋めることはなく、要素の高さだけをファイルします。

私はエラーを検出しました

Answer 1

...

フレキシボックスの問題は、あなたは彼らがロードされますよう、display: flexで容器に（角度）のコンポーネントを持っている場合app-samplecomponentタグが残り、それが仕事だ行うにフレキシボックスを乱すということです。