移动/小屏幕上的Wordpress侧边栏

Question

我在制作自定义主题的侧边栏时遇到问题。

以下是实际网站：http://bit.ly/1dqydiI

当我尝试通过移动设备查看它或将我的浏览器减少到470px或更低时，它开始在右边有一个“间隙”。

@media only screen and (max-width: 664px) {

    #main {
        overflow: visible;
    }
    #content,
    #primary,
    #secondary,
    #tertiary {
        background: none;
        float: none;
        margin: 0;
        padding: 0;
    }
    #primary,
    #secondary {
        width: 100%;
        position:relative;
    }
}

解决这个“差距”的唯一方法是在上面添加and (min-width: 500px)。但这造成了另一个问题。现在我没有“差距”，而是在中间和侧边栏中试图摆弄右边的所有内容。

一些照片： 新问题..

我不知道为什么它会在470px之后发生变化并导致我上面的问题..

Answer 1

我无法在全宽度上重现您的滚动+间隙错误。您在哪个浏览器上体验过它？

中级的.entry-date问题可以通过以下方式解决：

left: -3.4em;

在style.css的第1302行

我也看不到右边的空格。也许您可以发布完整的URL吗？

Answer 2

您需要更改#content div的填充。

#content { margin: 0 23% 0 0; }

23％的保证金权利解释了您所谈论的差距。