解决table设置宽度无效的问题
2017-03-20 14:30
453 查看
如果对table设置table-layer:fixed样式后,发现表格中有一行合并过,其它没有合并的行的列宽会平均化,对列宽的设置会失效。
解决方法:
在tbody前面加
解决方法:
在tbody前面加
<col style="width: 100px;"/> <col> <col style="width: 100px;"/> <col style="width: 100px;"/> <col style="width: 100px;"/>
.detail { padding-bottom: 50px; margin-top: 80px; } .detail_table { table-layout:fixed;/*列宽由表格宽度和列宽度设定。*/ margin: auto;/*table居中*/ text-align: center; border: 1px solid #804040; border-collapse: collapse; } .detail_table th { padding: 26px;; } .detail_table td { border: 1px solid #804040; padding-top: 16px; padding-bottom: 16px; } .special { text-align: left; padding-left: 20px; }
<div class="detail"> <table class="detail_table"> <thead> <th colspan="5">选择的选项明细</th> </thead> <!--写的话就按照你写的宽度,但是如果你写的宽度占不满table它会按照你给的尺寸的比例平分至每个td--> <!--现在这么写就是四列是100px,没给数据的那一列占剩下的全部--> <col style="width: 100px;"/> <col> <col style="width: 100px;"/> <col style="width: 100px;"/> <col style="width: 100px;"/> <tbody> <tr> <td> 序号 </td> <td> 症状 </td> <td> 符合 </td> <td> 不符合 </td> <td> 不确定 </td> </tr> <?php $i = 1; ?> <?php foreach ($test as $item): ?> <!--拿到选择项--> <?php $temp = $this->session->userdata('b' . $i) ?> <tr> <td> <?php echo $i; ?> </td> <td> <?php echo $item; ?> </td> <td> <?php if ($temp == 1): ?>√<?php endif ?> </td> <td> <?php if ($temp == 2): ?>√<?php endif ?> </td> <td> <?php if ($temp == 3): ?>√<?php endif ?> </td> </tr> <?php $i++; ?> <?php endforeach; ?> </tbody> </table> </div>
相关文章推荐
- 解决设置table-layout:fixed后无法设置宽度的问题
- 表格Table宽度设置无效的解决方法
- (待解决问题)nowrap在table和td都设置了宽度的时候仍然有效
- [HTML]表格Table宽度设置无效的解决方法
- label和span标签设置宽度width无效问题的解决方式
- 设置div table 等元素高度宽度百分之一百 100% 无效解决办法...
- 解决table设置了table-layout:fixed后单,元格宽度设置无效的方法
- 表格Table宽度设置无效的解决方法
- 解决表格设置table-layout:fixed后单元格宽度设置无效的方法
- 表格Table宽度设置无效的解决方法
- html table宽度设置,本篇方法成功解决了我徒手写html的问题
- div宽度设置无效问题解决
- label和span标签设置宽度width无效问题的解决方式
- table和div设置height:100%无效的完美解决方法
- 解决IE6下div层设置高度1px无效的问题
- vs无法设置断点或断点无效问题解决方法
- 今天抓取table里面,td设置了宽度还是不会换行,用css解决
- table和div设置height:100%无效的完美解决方法
- 网页内容设置有用的meta设置解决网页内容不能适应某些浏览器宽度的问题
- position:absolute与overflow:hidden,解决子元素设置position:absolute后父元素 overflow:hidden无效的问题