小编ver*_*ion的帖子

我正在使用Material UI创建一个简单的图标下拉菜单.但是在渲染后出现字形并且MenuItems在点击它之后没有显示.这是代码 -

import {FontIcon, MenuDivider, IconMenu, IconButton} from 'material-ui' ;
let MoreVertIcon = require('material-ui/lib/svg-icons/navigation/more-vert');
const MenuItem = require('material-ui/lib/menus/menu-item');
var PostCard = React.createClass({
  render: function(){
    let button = (
            <IconButton
                touch={true}
                tooltip='Click to see menu.'
                tooltipPosition='bottom-left'>
                <MoreVertIcon />
            </IconButton>
        );
    return (
      <div>
        <IconMenu iconButtonElement={button}>
              <MenuItem primaryText="Refresh" />
                          <MenuItem primaryText="Send feedback" />
                          <MenuItem primaryText="Settings" />
                          <MenuItem primaryText="Help" />
                          <MenuItem primaryText="Sign out" />
        </IconMenu>     
      </div>
    );
)};

我在我的网页中有以下HTML,我希望将侧边栏固定在左侧.它在Chrome中工作正常,但Firfox没有将侧边栏显示为固定:

<div id="sidebar">
    <!-- Logo -->
        <div >
            <h1>Heading</h1>
        </div>
            <!-- Nav -->
                <nav id="nav">
                    <ul>
                        <li><a href="#target1" >About</a></li>
                        <li><a href="#target2" >Works</a></li>
                        <li><a href="#target3" >Our Team</a></li>
                        <li><a href="#target4" >Contact</a></li>

                    </ul>
                </nav>

</div>

上面代码的CSS是:

#sidebar
{
    position: fixed;
    top: 0;
    padding: 3em 1.35em 1em 1.15em;
    height: 100%;
    width: 12em; 
    background: #364050 ;
    box-shadow: inset -0.1em 0em 0.35em 0em rgba(0,0,0,0.15);
}

请给我一些解决方案,以便侧边栏在Firefox中保持固定.

DOWNVOTERS请先评论.