[Web/Easyui]table里的列宽怎么设置都不正确？

最新推荐文章于 2023-04-14 21:15:49 发布

原创最新推荐文章于 2023-04-14 21:15:49 发布 · 434 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#html

web 同时被 2 个专栏收录

2 篇文章

订阅专栏

easyui

1 篇文章

订阅专栏

作者在调整EasyUI tabs组件时遇到宽度问题，发现内部input元素的100%宽度导致布局异常。通过将宽度改为95%，解决了组件的拥挤问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

试了老半天，发现怎么设置，他要不没反应，要不就是他width他自己的，跟自己设置的width一点都不一样，郁闷坏了，什么鬼情况？左边怎么这么挤啊？

<div id="tt" class="easyui-tabs" style="width: 100%;height: 100%">
    <div title="sj">
        <form method="post" id="editForm" name="editForm" fit="true">
            <input type="hidden" name="others" id="others"/>
            <table class="tableForm tableCss">
                <colgroup>
                    <col style="width: 185px" />
                    <col style="width: 175px;" />
                    <col style="width: 135px" />
                    <col style="width: 175px;" />
                    <col style="width: 115px" />
                    <col style="" />
                </colgroup>
                <tr>
                    <th style="">课程：</th>
                    <td colspan="5">
                        <input class="easyui-combobox" style="width: 100%" id="add_course_id" name="po.course_id" value="${(po.course_id!)!}">
                    </td>
                </tr>
                <tr>
                    <th style="">知识点：</th>
                    <td style="">
                        <input class="easyui-combobox" style="width: 100%" id="add_knowledge_points" name="po.knowledge_points" value="${(po.knowledge_points!)!}">
                    </td>
                    <th style="">试卷名：</th>
                    <td style="">
                        <input class="easyui-textbox" style="width: 100%" name="po.topic" value="${(po.topic!)!}" id="topic_e">
                    </td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <th style="">类型：</th>
                    <td style="">
                        <input class="easyui-combobox" style="width: 100%" id="type" name="po.type" value="${(po.type!)!}">
                    </td>
                    <th style="">难易度：</th>
                    <td style="">
                        <input class="easyui-combobox" style="width: 100%" name="po.difficulty_level" value="${(po.difficulty_level!)!}">
                    </td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <th style="">单选题数量：</th>
                    <td style="">
                        <input class="easyui-numberbox" style="width: 100%" type="text" name="po.single_selection" value="${(po.single_selection!)!}" data-options="required:true">
                    </td>
                    <th style="">单选题分数：</th>
                    <td style="">
                        <input class="easyui-numberbox" style="width: 100%" type="text" id="single_fraction" name="po.single_fraction" value="${(po.single_fraction!)!}" data-options="min:0,precision:2,required:true">
                    </td>
                    <th style="">单选题总分数：</th>
                    <td style="">
                        <input class="easyui-textbox" style="width: 100%" type="text" id="single_total_fraction" data-options="">
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>

一开始都想着是不是列宽没设置好，左改右改，没用，然后看到了内部input的宽度100%，是不是这个？

遂将其所有内部input的宽度改成了95%，发现可以了，正常了。吐血