响应式侧边栏/sidenav 显示内容（仅限移动设备）

【问题标题】：Responsive Sidebar/sidenav displays over content (mobile only)响应式侧边栏/sidenav 显示内容（仅限移动设备）
【发布时间】：2014-09-07 08:49:15
【问题描述】：

刚接触响应式设计，这让我很头疼。我的网站在桌面上运行良好，并且在调整大小时运行良好。右上角的菜单应该是隐藏的，但仅在移动设备上，在登陆主页时会显示。

现场示例（仅移动设备上的问题）：http://www.fireflyaz.com/

【问题讨论】：

【解决方案1】：

在 default_modified.css 中，#showSlideMenu 的 CSS 设置为 50% 的宽度，因此即使侧边栏未打开也会显示。将类名更改为 #showSlideMenu.cbp-spmenu-open，以便 css 仅在侧边栏打开时应用。你的风格如下：

#showSlideMenu.cbp-spmenu-open {
    float: right;
    overflow: hidden;
    text-align: right;
    width: 50%;
}

【讨论】：