Question

我的网站托管在blogger.com上，但我上传了一个完全自定义的主题，并调整了代码以稍微改变设计。该主题是移动友好的，除了我的实际博客帖子文本只显示在移动设备上的一半页面。这就好像页面被切成两半，因此一半的句子没有显示。即使你试图缩小。它只显示移动设备上的桌面视图而不缩放，因此只有一半可见。移动网站上的其他一切都很完美。我迷失了如何解决这个问题...想为每个移动设备添加元标记？我试着添加

<meta name="viewport" content="width=device-width, initial-scale=1">

但它不起作用。基本上，我需要更改它，以便自动缩放不同移动设备的博客帖子。

我的博客文章字体和页面宽度的CSS已指定

#test{
width: 680px; 
margin: 0 auto; 
text-align: left;

font-size: 15px; 
line-height: 24px; 
letter-spacing: -0.01em;

}

HTML

<div id="test">BLOG TEXT</div>`

想知道是否有更简单的解决方案？

干杯，

Answer 1

您可以尝试一件事：

#test {
    width: 680px; /* your main container */
    margin: 0 auto; /* centering it */

    max-width: 100%; /* don't let the container be bigger than the body! */

    /* ... the rest of your css... */
}

这样，如果视口小于680px（大多数手机都是），则您的内容不会溢出。如果这不起作用，您可以考虑在此处发布指向您博客的链接，以便我们可以查看正在进行的内容的完整背景。

使博客文章移动友好

1 个答案: