css - 在 td 中带有 Span 的 Div

Question

我有一张看起来像这样的 table ......

<td>
<div style="float:left">
<img src="image1.png" style="display:block" /><br>
<img src="image2.png" />
</div>
<span> <input type="input" />
</td>


<td>
<div style="float:left">
<img src="image1.png" style="display:block" /><br>
<img src="image2.png" />
</div>
<span> <input type="input" />
</td>

我设置了 style=float 使图像和输入字段对齐。

但问题是当我调整浏览器大小时，div 漂浮在我不想要的 td 上。

这个问题有解决办法吗？？

Answer 1

首先你必须检查你的html，关闭那些标签(<span></span>);)

其次，当元素 float 时，容器不会读取高度，所以你必须在 float 元素下面添加一个更清晰的div。

<div style='clear:both;'></div>

示例:

    <td>
    <div style="float:left">
    <img src="image1.png" style="display:block" /><br>
    <img src="image2.png" />
    </div>
    <div style='clear:both;'></div>
    <span> <input type="input" /> </span>
    </td>


    <td>
    <div style="float:left">
    <img src="image1.png" style="display:block" /><br>
    <img src="image2.png" />
    </div>
    <div style='clear:both;'></div>
    <span> <input type="input" /> </span>
    </td>