CSS柔性屬性不會隨角4

Question

工作，我有以下的CSS樣式（全局樣式表）：

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

在純HTML文件中，容器使用窗口的最大高度。 然而，在我的Angular 4項目中，flex屬性幾乎沒有任何效果。爲什麼？我該如何解決這個問題？

這裏是一個的jsfiddle：jsfiddle

這是它應該如何工作。但是當我將HTML模板移動到角度時（將全局樣式表中的特定CSS分割爲component.css文件和全局樣式#container），它不再有效。容器不會填充整個寬度，只是記錄元素的高度。

Answer 1

我發現錯誤...

與Flexbox的問題是，如果你在容器（角）組件與display: flex，因爲他們得到加載app-samplecomponent標籤仍然存在，擾亂Flexbox將做的工作。