材質UI菜單高度問題

我想通過應用CSS來設置菜單高度等於窗口高度。如果頁面中的元素垂直增加，則相對於頁面長度，菜單高度也應該增加。我已經使用「身高：100％」&也嘗試使用「身高：100vh」的風格，但它不工作。材質UI菜單高度問題

任何幫助？

我有以下代碼：

import React, { Component } from 'react'; 
import Menu from 'material-ui/Menu'; 
import MenuItem from 'material-ui/MenuItem'; 
import './mystyle.css'; 

const mainmenu = { 
width: '180px', 
height: '100%', 
}; 

class MenuView extends Component { 
render() { 
    return (
    <div className="dash-menuview"> 
     <Menu style={mainmenu} className="mydashboard"> 
     <MenuItem primaryText="My Name" style={{color:'white'}} href="#/name" onClick={handlers.changeURL}/> 
     <MenuItem primaryText="Personal Information" style={{color:'white'}} href="#/information" onClick={handlers.changeURL}/> 
     <MenuItem primaryText="My Address" style={{color:'white'}} href="#/current" onClick={handlers.changeURL}/> 
     <MenuItem primaryText="My Files" style={{color:'white'}} href="#/files" onClick={handlers.logout}/> 
     </Menu> 
    </div> 
); 
} 
} 
export default MenuView;

mystyle.css

.dash-menuview { 
    margin-left: -8.8%; 
} 
.mydashboard { 
    background: #545454; 
    color: #FFFFFF; 
    text-decoration: none; 
    color: white; 
    margin-left: 0%; 
    font-weight: bold; 
}

來源

2017-10-14 Subhojit

嘗試用height:30更換height:100%也同樣高度分配給lineHeight:30

來源

2017-10-15 05:58:25

它不工作..仔細閱讀問題..我想菜單高度增加自動無論何時頁面中的元素垂直增加。例如，假設我點擊'個人信息'，頁面中的元素增加，滾動條出現，菜單高度也應該相對於窗口自動增加。這就是全部.. – Subhojit

請提供更多信息作爲你目前擁有的圖片和你想要的輸出。也嘗試添加jsfiddle或codepen。 –

材質UI菜單高度問題

回答

相關問題