Question

我正在一个由另一个人开发的网站上工作。这个网站设计与wordpress通过覆盖基本主题（空白）。这是链接： http://www.good-look.it 这儿存在一个问题。当您调整浏览器窗口的大小时，您可以看到具有白色背景的div响应，但不是。在移动设备上，问题更明显。我无法找到解决方案。管理图像幻灯片的插件可能存在问题（Photocrati的NextGEN Gallery）？

Answer 1

问题出在此文件中：http://www.good-look.it/wp-content/themes/blankslate/css/struttura.css

有许多CSS样式与＆＃34;！important＆＃34;在他们。例如：

wrapper {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    vertical-align: top;
    width: 940px !important;
}

此容器的宽度将始终为940px，与您现在的方式相同。在Firebug＆＃34;固定＆＃34; ＆＃34;品牌＆＃34;部分。虽然这会影响响应行为，但CSS中存在许多问题。

Answer 2

首先，我应该清楚该网站是用html，css，php，js等制作的 - 所以WordPress真的很无关紧要。

大多数网站并没有真正以一种具有响应性的方式进行规划，但白色div的具体问题是它具有响应性，但内部的滑块 - 没有响应，并使用绝对定位---所以它的位置从父div中掉出来，然后使内容比白色div更宽，因此比窗口本身更宽。

在检查器中有一些快速样式 - 滑块实际上是“响应”。

替换

.wrapper {
  width: 960px !important;
  ...

与

.wrapper {
  width: 100%;
  max-width: 940px;
  ...

它会让你更近一点......

Answer 3

在设计响应式网站时，请确保在定义宽度时使用％age而不是像（940px）这样的像素。 bcoz它会根据您当前的设备尺寸安排您的div年龄％，但在定义width:940px时，无论您的屏幕尺寸如何，都会占用该宽度...

div内容没有响应

3 个答案: