移动浏览器上的宽度属性出现故障

Question

我正在对跨平台设计做一些粗略的实验，所以我制作了一个快速原型，但我注意到第二个区域是＆＃34;音乐播放器＆＃34;拉伸不适合适当的宽度，如标题所示＆＃34;音乐，关于，联系＆＃34;。

所有相关的源代码都在http://shacktown.com，但#header是正确适合屏幕的对象，#content是出现故障的对象。以下是他们的定义：

    #header, #content {
        margin: 10% 15% 5% 15%;
    }
    #content {
        margin-top: 0;
        background-color: #000000;
        background-image: url('/engine/img/trans.png');
    }

为什么#content行为不像#header？

的任何想法