CSS滑出菜单问题_Css_Cordova_Topcoat

CSS滑出菜单问题

css cordova

CSS滑出菜单问题,css,cordova,topcoat,Css,Cordova,Topcoat,Im使用topcoat（topcat.io）、backbone.js和Phonegap构建移动应用程序Im。我想创建一个Facebook风格的滑出菜单。以下是本教程的链接：以下是工作正常的JSFIDLE：从本质上看，它看起来像： <body> <div class="topcoat-navigation-bar"> ... </div> <nav class="side-nav"> ..

Im使用topcoat（topcat.io）、backbone.js和Phonegap构建移动应用程序Im。我想创建一个Facebook风格的滑出菜单。以下是本教程的链接：

以下是工作正常的JSFIDLE：

从本质上看，它看起来像：

<body>
    <div class="topcoat-navigation-bar">
         ...
    </div>

   <nav class="side-nav">
        ...
   </nav>

   <div class="main-content">In the content</div>
</body>

因为我的应用程序包含许多模板，这些模板是在这个简单的库的帮助下进行转换的，所以我需要在主体之后和内容周围有一个标记。然而，当我这样做时，可以看到菜单背后的主要内容。以下是JSFIDLE：

我为div添加了css（复制主体css）：

你知道为什么菜单现在会显示在内容中吗？

从

更改背景。主要内容

例如：

background: inherit;

到

演示：

div.current-page{
    margin:0;
    padding:0;
    height: 100%;
    font-family: source-sans-pro, sans-serif;
    position: relative;
    width: 100%;
    height:100%;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
}

background: inherit;

background: white;