Question

我的主页上有一些问题 - ＆gt; http://holtumdata.dk/mission 在我修复了关于PC分辨率的缩放问题之后，我是否遇到了新问题。每当我从全屏幕点击一个窗口时，缩放比较奇怪，并且文本放置不正确。

我该怎么做才能解决这个问题？

您可以转到http://holtumdata.dk/mission来查看问题然后在浏览器中从全屏变为窗口模式。（尝试拉到不同的尺寸，看看它是如何变化的。）

谢谢！

   */
.blog #content {
  margin-left: 100px;
padding: 0 0 1.53846153846154em 0;
  background-color: transparent;
}
@media screen and (min-device-width: 1920px) {
#content {
  margin-bottom: 1.53846153846154em;
  margin-left: -21em;
} }
@media screen and (min-device-width: 1600px) and (max-device-width: 1919px)  {
#content {
  margin-bottom: 1.53846153846154em;
  margin-left: -11.5em;
} }
@media screen and (min-device-width: 1440px) and (max-device-width: 1599px)  {
#content {
  margin-bottom: 1.53846153846154em;
  margin-left: -2em;
} }
@media screen and (max-device-width: 1439px) {
#content {
  margin-bottom: 1.53846153846154em;
} }
.single #content {
padding: 0;
}
.page-template-gallery-fullscreen-php #content {
display: none;
}

上面添加的代码。

Answer 1

我发现了这个：

@media screen and (min-device-width: 1920px)
    #content {
    margin-bottom: 1.53846153846154em;
    margin-left: -21em;
}

将margin-left设置为0将解决问题。

Answer 2

对我来说，问题似乎是您不考虑小窗口大小的屏幕尺寸。所以基本上你需要在你的css中添加另一个@media屏幕标签，用于小窗口的显示。如果您不考虑屏幕尺寸，移动用户也会遇到与文本相同的事情

页面在窗口模式下无法正确缩放

2 个答案: