为 WP 站点中的小部件和小部件区域添加或调整 CSS答案

【问题标题】：Adding or adjusting CSS for widget and widget area in WP site为 WP 站点中的小部件和小部件区域添加或调整 CSS
【发布时间】：2013-02-23 02:59:41
【问题描述】：

我希望我能正确解释这一点。我有主页。它上面有 4 个小部件区域。每个小部件区域都有一些内容（您将在我包含的屏幕截图中看到）。三个小部件只是带有疯狂 CSS 的文本，并且在标题周围有一个带有框的标题（包括文本）。第 4 个小部件无关紧要，因为它只是一张图片。

一个小部件的标题有一个框、半径、背景颜色，并且它与小部件内的其余信息左/右对齐。另外两个小部件 - 标题在整个小部件区域左右 100% 左右对齐。

查看图片，因为它会更有意义。

这里是图片的直接链接以供查看：http://postimage.org/image/ofdqc1sa7/

wdiget 部分“新客户” - 看看它是如何左/右对齐的。它延伸了整个盒子的整个宽度。现在看看 Existing 和 Why - 它是如何不一直延伸到左右两侧的。我怎样才能让它一直伸展？我已经经历了很多次改变这个/改变那个。我在 Firefox 中的 Firebug 很火，但我似乎无法获得正确的 CSS 代码来实现这一点。快把我逼疯了。

感谢任何帮助。提前感谢您的回复...

【问题讨论】：

标签： css widget

【解决方案1】：

改变这种风格

.cl-content {
    margin: 8px;
}

到这里

.cl-content {
    margin: 0px;
}

但是，这会导致您的列出现一些对齐问题。但是，那个类是导致你的问题的原因。

[编辑]

如果您将 #text-17 和 #text-18 宽度更改为 670 像素，它应该可以解决您的问题。

我还将 #LoginWithAjax 更改为 #LoginWithAjax { padding: 5px; }

【讨论】：

嗨，克里斯。这很完美。我可以调整列。通过代码更改左右移动它们不是问题。我刚刚调整了一段代码，你就有了。非常感谢您的修复...

【解决方案2】：

最初我会说可能存在填充问题。是否有实时链接可供我通过 firebug 进行进一步故障排除？

【讨论】：

其他人在我之前得到了它。谢谢。 =)