- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我使用表格来生成简单的水平图表(以便于缩放)。我使用 colspanning 来获得精确的重叠(有时单元格彼此重叠,但在此示例中不是)。
我的问题是 IE(8) 渲染相对单元格宽度错误。
我知道单元格不能小于它的内容,但这不是这里的问题。
例如,示例中的“X 65”单元格比 IE 中的 47% 宽很多。然而,Firefox 做得很好。
例子如下:
<html>
<body>
<style>
table.CompAnalysisTable {
border-width: 1px;
border-spacing: 0px;
border-style: solid;
border-color: black;
border-collapse: collapse;
background-color: white;
font-size:8px;
}
table.CompAnalysisTable td {
border-width: 1px;
border-style: solid;
border-color: black;
}
table.CompAnalysisTable td table
{
border-style:none;
}
</style>
<table>
<tr>
<td>
</td>
<td class="nobr" valign="middle" align="left">Graph</td>
<td valign="middle" width="100%" align="right">Total 73</td>
</tr>
</tbody>
</table>
<table class="CompAnalysisTable" width="100%" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td class="nobr" style="width: 47%; background-color: rgb(172, 172, 255);" colspan="65">X 65</td>
<td class="nobr" style="width: 47%; background-color: white;" colspan="65"></td>
<td class="nobr" style="width: 5%; background-color: rgb(172, 172, 255);" colspan="7">A 7</td>
<td class="nobr" style="width: 1%; background-color: rgb(172, 172, 255);">B 1</td>
</tr>
<tr>
<td class="nobr" style="width: 47%; background-color: white;" colspan="65"></td>
<td class="nobr" style="width: 52%; background-color: rgb(255, 152, 152);" colspan="72">A 72</td>
<td class="nobr" style="width: 1%; background-color: rgb(255, 152, 152);">B 1</td>
</tr>
</table>
</body>
</html>
我已经尝试过其他技术,例如 div 和每行的单独表格,但 colspanning 是获得精确重叠的唯一技术。
另一种解决方案是在服务器上渲染图像,但我放宽了缩放比例并且非常耗时。
非常感谢任何帮助。
最佳答案
像这样的 header 可以通过将其呈现为 IE 7 来省去为 IE 8 修复它的麻烦:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
除此之外,您可以尝试查看 IE 8 正在做什么,并使用特定的 html 条件修复它:
<!--[if IE 8]><![endif]-->
我希望我能提供更多帮助,但我没有 IE 8,所以看不到问题。
也许这些链接可以提供帮助:
HTML conditions
Beyond Doctypes
关于css - Internet Explorer 中的表 colspan 相对宽度问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1357818/
根据我对 JavaScript 的理解,任何属性都可以使用 element.attribute = newValue 设置。因此,我尝试使用 element.colspan = 2 设置多个表格单元格
地点ID: 3 我想使用 JQuery 将第一个 TR 中未包含在完整页面中的第一个 Colspan="2"替换为 Colspan="4"。 谢谢。 最诚挚的问候,女士 最佳答案 这个 jQuery
您好,我有一个表,其中一行中的某些列与 colspan="2" 属性相关联。 此刻它看起来像这样: 我希望一行中连接的列的文本居中,但只有连接列中的文本 该行的表格数据(无限制)有如下代码 u
我是否可以检查现有表中的列数并将其分配给该表 colspan 的顶部? My code document.write('') document.write(' HEAD GRID ') for(i
我有一个表格,其中的单元格具有相同的值。我正在尝试使用 colspan 将它们合并在一起,但是为 colspan 设置属性没有任何效果。 https://jsfiddle.net/afn4f1q9/4
我已经使用了这个 .js 文件和以下方法。 https://code.jquery.com/jquery-3.3.1.js https://cdn.datatables.net/1.10.19/js/
我有一个响应式表格(在可变 div 宽度内设置为 100% 宽度),我试图在其中“重置”colspan,以便下一个表格行不会继承固定宽度 tds. 在我的示例中,数字 td(1 到 7)的固定宽度为
我的问题是,当我单击“span cell 1”按钮时,colspan 已正确完成,但头部 td 被扩展,并且随着表大小的增加,表布局受到干扰。它不能管理剩余的列吗? 如果我单击跨度单元格 1 按钮,则
这是第一个问题,所以请原谅我的任何错误。 我正在使用 JQuery Datatables 插件,并且必须向表中添加两行带有 colspan 的列标题。在 HTML 中硬编码没有问题,但现在我在表初始化
我使用的是响应式数据表并且工作正常,但问题出在 colspan 上。 当我使用带有 colspan 属性的 td 标签时,页面使用此链接引发错误 datatables warning table id
我正在使用以下 HTML 代码制作日历: Mon Tue Wed T
我有一张带有 colspan 的表,但表现不佳。 请比较以下 fiddle : http://jsfiddle.net/lucaswiener/WBdc8/ http://jsfiddle.net/l
jsfiddle 链接:http://jsfiddle.net/KMzjp/ 所以我试图根据表头 th 元素突出显示表列(有三个 th 元素,所以应该有三列,中间一列突出显示). 它在没有 colsp
我有一个包含很多行和列的表格。 现在我想像这样将 td "E8"分成两列: 什么是最好的解决方案? 最佳答案 单向: 您可以在同一行的所有其他单元格上使用 rowspan="2" 例子:
请看下面的html: Event Name City Date Price
我正在尝试使用 colspan 使图像与表格中的右侧对齐,并使带有文本的行在左侧对齐。当图像在左侧时,此方法通常有效,但现在我希望它在右侧,但它不起作用。请记住这是针对 outlook 电子邮件的,因
关闭。这个问题是not reproducible or was caused by typos .它目前不接受答案。 这个问题是由于错别字或无法再重现的问题引起的。虽然类似的问题可能是on-top
帮助!我在这里拔头发。我正在尝试 a) 在此表的第一行和第三行中执行 colspan,但它似乎不起作用。我希望两行都跨越三列,并且 b) 我无法显示图像并且我已经在网上进行了广泛的搜索并且已经解决了我
我正在创建一个应用程序,它允许用户通过添加和删除列和行、设置列宽和单元格列跨度以及将元素插入表格单元格来操作表格结构。在测试时,我遇到了一个场景,其中 Firefox 4 和 Internet Exp
表名:主题 我的预期输出 我的代码 setActiveSheetIndex(0); $headers = array('School Name'); $objPHPExcel->get
我是一名优秀的程序员,十分优秀!