用Snap.js填充内容

Question

我只想问一个简单的问题。我使用snap.js创建一个可滑动菜单，但是如何将填充添加到内容中？

以下是源代码：http://runnable.com/UoqMXucPORNzAAIH/how-to-create-a-mobile-shelf-using-snap-js-for-javascript

GitHub上的源项目：https://github.com/jakiestfu/Snap.js/

以下是内容的代码：

<div id="content" class="snap-content">
    <div id="toolbar">
        <a href="#" id="open-left"></a>
        <h1>Default</h1>
    </div>
    <!-- Here goes the content I guess, but there is no padding -->
</div>

我需要让#内容中的所有内容都可以用手指滑动。但我无法得到填充的内容，所以看起来很糟糕，在我看来..如果我将填充添加到#内容中，菜单也会得到它。然后，我尝试添加一个名为#main的新<div>，并将其放在#工具栏下，但由于某种原因，填充功能就像保证金一样。#main的宽度为100%，填充量为10 of。#工具栏显示为100%，但显示100% +10 it (左)+10 it(右)，因此它添加滚动，看起来很糟糕。

其他人是怎么解决这个问题的？

正如您在这个JSFiddle中所看到的，没有填充：http://jsfiddle.net/TorchMan/MexXY/

提前谢谢。

Answer 1

您可以将您所指的所有内容移动到新元素，例如：

<div id="content" class="snap-content">
    <div id="toolbar">
        <a href="#" id="open-left"></a>
        <h1>Default</h1>
    </div>

    <div id="content-wrapper">
        <!-- Here goes the content I guess, but there is no padding -->
    </div>
</div>

加上风格

#content-wrapper{
    padding:10px;
}

http://jsfiddle.net/MexXY/21/