Joomla 中的表格没有正确调整大小？答案

【问题标题】：Table in Joomla not resizing properly?Joomla 中的表格没有正确调整大小？
【发布时间】：2014-08-11 10:27:50
【问题描述】：

我目前正在尝试使用 Joomla 创建一个简单的网站。我上传了名为 Form Maker Lite 的 Joomla 扩展调查，目的是创建调查/问卷。

我在基于 Joomla 的网站上发布了这个扩展，很遗憾我无法调整表格的大小。我尝试使用width: px 来调整表格的大小，但它不起作用。

这是当前自动生成的表格 CSS：

   #form10 .wdform-matrix-table {
   display: table;
   border-spacing: 0px
   }

我在这里复制 HTML 时遇到问题，所以我尝试使用它（结果没有按预期出现，它应该以表格的形式出现）-My JSFiddle

我也尝试使用table-layout: fixed; overflow: hidden;，但不幸的是，这无助于重新调整表格大小。我想让桌子的宽度变短。

很遗憾，我无法提供对网站的访问权限，因为我对链接的公开没有完全控制/许可:(。我很抱歉。

任何帮助/建议/解决方案将不胜感激。

【问题讨论】：

标签： html css joomla css-tables joomla-extensions

【解决方案1】：

快速浏览该组件后，以下样式似乎通过覆盖默认设置为表单设置了 100% 像素的宽度。

<style>
.wdform_section {
    width:100% !important;
}

.wdform_column {
    width:100% !important; 
}

.wdform-field,.wdform_row {
    width:100% !important; 
    display:block !important;
}
.wdform-element-section {
    width:80% !important; 
}

.wdform-label-section {
    width:20% !important; 
}

</style>

据我所知，Form Maker Lite 将内联样式添加到表单元素中，您似乎无法对其进行编辑，这就是您需要 !important 覆盖它们的原因。

以上样式覆盖了 Joomla 2.5 版本中默认的“联系人”表单。它可能会为不同的表单生成不同的代码。

如果您还没有它，我建议您安装 firebug 来查看它生成的 css。这可以使覆盖 css 变得更加容易。

【讨论】：