邊欄高度因內容長度而異

我在我的angular2應用程序中的邊欄長度存在問題。我有一個導航組件，其中包括頂部導航HTML和側邊欄導航HTML。當應用程序加載側邊欄很好。如果我路由到其他組件，根據組件長度的不同，邊欄會變短或變長。我想修復邊欄的高度。請看圖片以瞭解我想說的話。主題模板取自here。

圖1 - 噹噹導航到其他部件邊欄高度因內容長度而異

圖

3應用程序加載

圖2- - 它變得更短

loggedIn.component.html

<div class="wrapper"> 
    <bmis-navigation></bmis-navigation> 
    <router-outlet></router-outlet> 
</div>

navigation.component.html
html是here css文件鏈接如下。 1- Admin.css 2- red.css

來源

2016-09-15 usmanwalana

你能發給我們你的css/less文件嗎？ –

我已經鏈接了css文件。我沒有使用 – usmanwalana

沒有CSS，所以很難診斷出這個問題。話雖如此，基於提供的代碼，我猜你的問題在於此，而不僅僅是DOM本身。

你有沒有給設置min-height或類似的解決方案？我建議，根據您的需要，東西沿着這些線路：

.main-sidebar { 
    min-height: ~"calc(100vh - @navigation-height)"; 
}

同樣，沒有太多的情況下儘可能的造型，但我希望這有助於！

P.S.我很抱歉，如果我的LESS語法完全關閉，我相信你正在使用它，但我沒有練習。

來源

2016-09-15 08:09:47 AsLittleDesign

我已經鏈接了這些css文件。我不會少用。 – usmanwalana

我沒有使用Angular或您正在使用的經驗。

但我認爲爲您的側邊欄設置最小高度可以解決問題。

來源

2016-09-15 08:44:20 Dr3am3rz

這應該是一個評論，而不是一個答案 –

邊欄高度因內容長度而異

回答

相關問題