Question

我正在尝试在div表中显示一些图像，但我不断在每个图像的底部获得边框。它大概是2-5个像素。

我会发送图片，但我是新用户。

我想删除此边框。

图像精确到52 x 10。

我只在这个应用程序的IE8中。

编辑：我正在做一个更大的布局 - 我把代码简化为我遇到的单个问题，这是表格底部的边框。

/*tables*/
.WorkFlowTableStyleA
{
    display: table;
    width: 10px; 
    border-collapse:collapse;
    border-style: none;  
}


/*rows*/
.WorkflowRowStyleA
{
    display: table-row;
    height: 52px;

}

/*arrow containers*/
.WorkflowCellArrowHolderA
{
    display: table-cell;
    width: 10px ;
}


<div class="WorkFlowTableStyleA">   
<div class="WorkflowRowStyleA">
<div class="WorkflowCellArrowHolderA" style="background-color: Black;">
<img src="../../Images/Flowchart/spacerTestTenByFiftyTwo.png" />

</div>
</div>
</div>

<div class="WorkFlowTableStyleA">   
<div class="WorkflowRowStyleA">
<div class="WorkflowCellArrowHolderA" style="background-color: Black;">
<img src="../../Images/Flowchart/spacerTestTenByFiftyTwo.png" />

</div>
</div>
</div>

Answer 1

MadHenchbot是关于“边界”来自哪里的钱。这不是你的div中没有空间的边界。（更改为style =“background-color：Red”）以验证。

好消息是，因为它听起来像你想要它们的大小我认为有一个快速修复：

/*tables*/
.WorkFlowTableStyleA
{
    display: table;
    /* get rid of width: 10px; */
    border-collapse:collapse;
    border-style: none;   
}


/*rows*/
.WorkflowRowStyleA
{
    /* get rid of display: table-row; */
    height: 52px;
}

/*arrow containers*/
.WorkflowCellArrowHolderA
{
    /* get rid of display: table-cell; */
    /* get rid of width: 10px; */
    height: 52px;                             <--- Add this to set the div height.
}

这对我有用。你可能不得不重新放入宽度，但我猜这是不必要的。另外，除非你正在构建一个布局，否则我不确定你为什么需要所有的table / div东西......它看起来只是让事情复杂化了？

删除div表的下边框

1 个答案: