表格未正确显示(奇怪的间距)

时间:2012-06-11 22:05:21

标签: html css css-tables

我在TD内的div中有一个表单。如果我将div放在桌子外面,它会很好,但是当我把它放在桌子里面时,顶部和底部会出现额外的间距。表单是正确的大小,但是包装div adCopyInlineEditContainer随机地具有更高的高度,即使我给它高度自动。

<div class="inlineEditCustomHolder blueBorder" style="top: 0px; left: 102px;"><div class="adCopyInlineEditContainer" style="">
    <form method="POST" class="adCopyInlineEdit">
        <input type="text" data-linetype="title" maxlength="25" data-maxlength="25" class="colorBlue"> <div class="counter"> <span class="ad_title_counter">0</span>/25</div> <br>
        <input type="text" data-linetype="desc1" maxlength="35" data-maxlength="35" class="colorGray"> <div class="counter"> <span class="ad_title_counter">0</span>/35</div> <br>
        <input type="text" data-linetype="desc2" maxlength="35" data-maxlength="35" class="colorGray"> <div class="counter"> <span class="ad_title_counter">0</span>/35</div> <br>
        <input type="text" data-linetype="dispUrl" maxlength="35" data-maxlength="35" class="colorGreen"> <div class="counter"> <span class="ad_title_counter">0</span>/35</div> <br>
    </form>
</div>
<div class="grid-handle" style="top: 176px; left: 256px;">
</div>
</div>

除了我的输入display:blockposition:absolute之外,我认为不包括我的CSS太相关了。

有什么想法?你可以在图片中看到顶部和底部的奇怪空间。

enter image description here

1 个答案:

答案 0 :(得分:1)

获取此代码

 <div class="inlineEditCustomHolder blueBorder" style="top: 0px; left: 102px;"><div class="adCopyInlineEditContainer" style="">
                            <form method="POST" class="adCopyInlineEdit">
                                <input style="float:left" type="text" data-linetype="title" maxlength="25" data-maxlength="25" class="colorBlue"> <div class="counter"> <span style="float:left" class="ad_title_counter">0</span>/25</div> <br>
                                <input style="float:left" type="text" data-linetype="desc1" maxlength="35" data-maxlength="35" class="colorGray"> <div class="counter"> <span style="float:left" class="ad_title_counter">0</span>/35</div> <br>
                                <input style="float:left" type="text" data-linetype="desc2" maxlength="35" data-maxlength="35" class="colorGray"> <div class="counter"> <span style="float:left" class="ad_title_counter">0</span>/35</div> <br>
                                <input style="float:left" type="text" data-linetype="dispUrl" maxlength="35" data-maxlength="35" class="colorGreen"> <div class="counter"> <span style="float:left" class="ad_title_counter">0</span>/35</div> <br>
                            </form>
                        </div>
<div class="grid-handle" style="top: 176px; left: 256px;">
</div>
</div>

查看演示: http://jsfiddle.net/r6jeE/