Css 表格宽度拥抱元素

Css 表格宽度拥抱元素,css,Css,我正在为我的一位姻亲开发一个网站,他坚持使用Joomla,以便将来自己能够更新内容。话虽如此,我为他开发的其中一个东西是他和他的兄弟们为一个游戏创建的角色生成器。这很好。问题是,他们想要一种在完成后打印最终表单的方法,这样做不需要所有的菜单、横幅等。我被告知最简单的处理方法是在URL中传递?tmpl=component,以去除所有内容,这也很有效 我遇到的问题是Joomla模板中的CSS导致了表的行为方式,我不知道如何更正。该页面由嵌套表组成,宽度定义为%(当前),但似乎忽略了专门定义的宽度,而

我正在为我的一位姻亲开发一个网站,他坚持使用Joomla,以便将来自己能够更新内容。话虽如此,我为他开发的其中一个东西是他和他的兄弟们为一个游戏创建的角色生成器。这很好。问题是,他们想要一种在完成后打印最终表单的方法,这样做不需要所有的菜单、横幅等。我被告知最简单的处理方法是在URL中传递
?tmpl=component
,以去除所有内容,这也很有效

我遇到的问题是Joomla模板中的CSS导致了表的行为方式,我不知道如何更正。该页面由嵌套表组成,宽度定义为%(当前),但似乎忽略了专门定义的宽度,而选择了包含最大单元格的宽度。看看我在说什么:

故障页面:

页面应该是什么样子的:


这两个地方的代码完全相同,第一个在Joomla内部,因此受模板的CSS约束。我对CSS了解不多,我想弄清楚应该覆盖什么以使第一个示例看起来像第二个示例,这让我自己都快发疯了。有什么想法吗?

您可以在页面上运行此脚本,它将在页面加载时删除有问题的
print.css
文件:

<script>
if (window.location.href.indexOf('/character-generator.html') > 0 &&
    window.location.href.indexOf('tmpl=component') > 0) {
    (function(){
        var links = document.getElementsByTagName('link');
        for (var i = 0; i < links.length; i++) {
            if (links[i].href.indexOf('/print.css') > 0) {
                links[i].href = '';
            }
        }
    })();
}
</script>

如果(window.location.href.indexOf('/character generator.html')>0&&
window.location.href.indexOf('tmpl=component')>0){
(功能(){
var links=document.getElementsByTagName('link');
对于(变量i=0;i0){
链接[i]。href='';
}
}
})();
}


注意,它仅在查询字符串中包含
tmpl=component
character generator.html
页面上运行。它还必须在
链接
元素之后运行,因此它应该插入
主体
标记或
头部
标记的最底部。既然您有可用的MooTools,您也可以使用。

您最好在问题本身中发布相关的标记、css和/或JS。当您删除此样式表时:
,页面显示如您所愿。不幸的是,我不确定是什么css导致了问题,否则我可以覆盖它,Artisteer创建的文件(用于创建模板)相当长。请在以下页面上运行此操作:
document.getElementsByTagName('link')[5]。remove()