Blogger博客存档显示在移动屏幕的一半页面上

Question

此https://www.neuroscientia.com/2018/08/之类的Blogger博客归档搜索结果仅显示页面一半的帖子，而另一半则空白，特别是在移动屏幕尺寸上。我已经调整了HTML源代码，但无法确定是什么原因造成的。

我正在使用响应式模板，已经设置了媒体屏幕和视点。所以我很困惑为什么会发生此错误。

我尝试过的类似线程： Blogger Static Pages Display Content on Half of the Page

该博客托管在Blogger上。请，我需要您的帮助，以全屏显示所有设备的Blog Archive搜索结果列表。

Answer 1

在代码中有以下命令：

@media only screen and (max-width: 755px)
   .sidebar-wrapper1 {
      display: none;
}

将其关闭，右侧列将不会消失！

或者，如果您要将其余列的宽度设置为100％，则

    .blog-posts-wrapper 

设置为

        width: 48%;

所以您需要将其更改为100％。

编辑：

    @media only screen and (max-width: 755px) {
         .blog-posts-wrapper  {
             width:100%;
         }
    }

如果仍然无法正常工作，请添加width：100％！important;

Answer 2

由于.blog-posts-wrapper具有float: left，因此，如果要使它们在移动屏幕上位于中心位置，则必须设置float: none; margin: auto

@media (max-width: 767px) {
  .blog-posts-wrapper {
      float: none;
      margin: auto;
  }
}

OR

如果希望它们在移动屏幕上全角显示，请设置：

@media (max-width: 767px) {
  .blog-posts-wrapper {
      width: 100%;
  }
}