ECSide标签<ec:table>表格对不齐问题处理

现象如下图

处理方式如下

javascript 复制代码
<ec:table styleClass="dynamic-table"> /* 为表格添加如下样式 */

</ec:table>



<style>
.dynamic-table {
    table-layout: fixed !important; /* 关键:防止列宽自适应破坏布局 */
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 auto; /* 居中显示 */
    white-space: normal !important; /* 确保子元素可换行 */
}

.dynamic-table th, 
.dynamic-table td {
    border: 1px solid #ddd !important; /* 统一边框 */
    padding: 8px !important;           /* 内边距一致 */
    text-align: center !important;    /* 文本居中 */
    word-wrap: break-word !important;  /* 长文本换行 */
    overflow-wrap: break-word !important; /* 现代浏览器优先 */
    max-width: 100% !important; /* 强制内容最大宽度不超过单元格 */
    text-wrap-mode: wrap;
}
</style>

处理后效果如下

相关推荐
摇滚侠2 小时前
外边距问题 塌陷问题 HTML CSS
css
W.A委员会3 小时前
CSS中的单位
css·css3·html5
nbwenren4 小时前
2026实测:Gemini 3 镜像站视觉能力实践——拍照原型图,一键生成 HTML+CSS 代码
前端·css·html
之歆7 小时前
Day07_CSS盒子模型 · 样式继承 · 用户代理样式
前端·css
爱上好庆祝10 小时前
学习js的第五天
前端·css·学习·html·css3·js
EnCi Zheng11 小时前
M5-markconv自定义CSS样式指南 [特殊字符]
前端·css·python
前端老石人11 小时前
前端开发中的 URL 完全指南
开发语言·前端·javascript·css·html
开开心心就好12 小时前
近200个工具的电脑故障修复合集
安全·智能手机·pdf·电脑·consul·memcache·1024程序员节
用户0595401744612 小时前
把多级缓存一致性验证从手工测试换成 Pytest 参数化,Bug 排查时间缩短 90%
前端·css
用户0595401744612 小时前
把 Redis 持久化测试从 800 行 Shell 换成 30 行 pytest,排错效率翻了 10 倍
前端·css