修复错误响应CSS Zen subtheme

Question

我有一个响应的Drupal Zen次主题，我在一起大约一年时间和半个月前来自一些CSS＆amp;非Drupal设计师为我的网站传递给我的HTML。我知道在某些布局中，它是有缺陷的，需要修复，但我还没有解决它。在多次联系当地的Drupal开发人员（并提供支付给他）后，我已经厌倦了等待，只需要解决这个问题。

移动设备上人们的跳出率非常糟糕。

网址为http://developcents.com。任何设备上的主页看起来都不错。但是，在某些屏幕尺寸（包括移动设备）中查看时，内部页面需要很多帮助。我们以http://developcents.com/blog为例。

在下面的场景中，我的问题不是如何找到CSS文件本身。相反，我的问题是，如何使用Firebug Lite找到必要的CSS设置，以便我可以通过浏览器调试CSS，而不是每次我想测试更改时都必须手动更新每个CSS文件？

我无法找到实际的CSS样式divs，blocks等...导致布局在某些维度下中断。我知道如何在CSS面板中查找和编辑CSS，但我无法在此实例中找到特定的CSS。

此外，作为第二个问题，如果您想提供我实际需要更改的内容的指示，那么请成为我的客人！但是，如果你指出我正确的方向，我可以自己弄明白，那也没关系。 ：）

让我们继续讨论这个场景（你可以通过自己测试来轻松看到）：

当我将浏览器窗口调整到一定大小时，链接＆amp;左侧边栏中的推文部分向右移动，以便导航栏的左侧与标题区域的右侧对齐，而内容跨越页面的整个宽度，除了左边距，其保留在地方，但变宽。基本上标题下方的所有东西都搞砸了，更容易看到问题而不是解释它们（所以去测试一下）。

在Chrome中使用Firebug Lite，我似乎无法找到“主要”内容区域的左边距（请参阅此屏幕截图清楚地显示黄色边距），也无法找到导航栏/推文块的CSS（我认为是某种浮动）。

Answer 1

要在Firebug或Firebug Lite中修改CSS，只需在HTML panel中选择一个元素，或通过其检查器进行检查。在Style side panel内，您将看到适用于该元素的所有CSS规则。

单击CSS属性的名称或值将打开内联编辑器以允许对其进行编辑。

在每条规则的右侧，您将看到样式表的名称，其中包含规则。将鼠标悬停在其中会显示完整的网址，然后点击该网址即可在CSS panel。

中进行检查

您也可以直接在 CSS 面板中编辑样式，该面板列出了页面上可用的所有样式表。

注意：您在那里所做的更改不是永久性的，即在下一页重新加载时它们已经消失了！要进行永久性更改，您需要编辑服务器上的文件。

另请注意，我指的是Firebug中的面板。 Firebug Lite中的面板基本上是相同的，但可能看起来和工作有点不同。此外，Firebug Lite不再维护，因此不能保证一切都按预期工作。