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>

处理后效果如下

相关推荐
川石课堂软件测试10 小时前
UI自动化测试|CSS元素定位实践
css·测试工具·ui·fiddler·单元测试·appium·harmonyos
龙井>_<10 小时前
vsCode解决css代码补全不生效问题,UnoCSS插件失效修复
前端·css·ide·vscode
2501_9181269110 小时前
一个上帝类程序作画
前端·css·css3
#麻辣小龙虾#1 天前
小学三年级语文小游戏
css·html·css3
开开心心就好1 天前
清理重复文件释放C盘空间的工具
安全·智能手机·pdf·gitlab·音视频·intellij idea·1024程序员节
2501_918126912 天前
小圆点踢足球
css·html·css3
dsyyyyy11012 天前
只用HTML和CSS实现换一换效果
前端·css·html
gogoing2 天前
UnoCSS / Tailwind CSS 类名速查文档
css
2501_918126912 天前
火柴人踢任意球
javascript·css·css3
晓得迷路了2 天前
栗子前端技术周刊第 132 期 - date-fns 支持 Temporal、npm 攻击事件、VoidZero...
前端·javascript·css