在这两个方面切断了约20px - 移动网站

Question

String#gsub是我正在处理的网站。它是用wordpress制作的。我通过

进行所有更改，使移动设备友好

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

我通过桌面上的chromes inspect元素查看我的所有更改，然后使用移动视图。

当你看一下网站时，左右有额外的空间，可能就像20 / 30px一样。我想把这个多余的空间剪掉，这样就可以放大，这些文章占据了整个屏幕（可能距屏幕两侧2px）。

我不确定我需要改变什么来实现这一目标。我一直在努力解决这么多因素，但我无法找到一个可以直接改变网站规模的元素。

示例图片：

现在就是这样 http://juniorgoldreport.com/

这就是我想要做的事情：

Answer 1

在CSS中找到此代码：

@media (max-width: 999px){
.sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta, .sidebar .comment-list, .sidebar .comment-reply-title, .sidebar .comment-navigation, .sidebar .comment-respond .comment-form, .sidebar .featured-gallery, .sidebar .post-navigation .nav-links, .author.sidebar .author-info {

并更改其中的最大宽度。我在100％测试它，它似乎做你想要的。

Answer 2

您的.entry-content元素似乎设置为max-width为604px。尝试删除此行：

    max-width: 604px;

从这里开始：

@media (max-width: 999px){
    .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta, .sidebar .comment-list, .sidebar .comment-reply-title, .sidebar .comment-navigation, .sidebar .comment-respond .comment-form, .sidebar .featured-gallery, .sidebar .post-navigation .nav-links, .author.sidebar .author-info {
        padding-left: 0;
        padding-right: 0;
    }
}

Answer 3

看看你的style.css第2267行。

20px的左右填充正在应用于#content .entry-content（以及其他一些内容）。

#content .entry-header,  #content .entry-content,  #content .entry-summary,  #content footer.entry-meta,  #content .featured-gallery,  .search.sidebar .page-content,  .blog.sidebar .page-content,  .sidebar .post-navigation .nav-links,  .paging-navigation .nav-links,  #content .author-info,  .comments-area .comments-title,  .comments-area .comment-list,  .comments-area .comment-navigation,  .comment-respond,  .sidebar .site-info,  .sidebar .paging-navigation .nav-links {padding-left: 20px; padding-right: 20px;}