我正在尝试将绝对定位的图像放入td中。 以下代码在FF 3.6中的图像上方会产生不必要的间隙,并使该图像在IE 7中消失。我在表代码之前已包含相关的外部样式表元素。

#leftColTopTdImg
{
 padding:0px;
 margin:0px;
 position:relative;
}
#navLinksTD
{
position:relative;
padding:0px;
margin:0px;
}
#navLinksBoxDiv
{
position:relative;
width:100%;
height:100%;

padding:0px;
margin:0px;
}
#navLinksInBox
{
position:relative;
}
#navLinksBg
{
position:absolute;
width:100%;
height:100%;
}

    <table width="222px" cellspacing="0px" cellpadding="0px" border="0px">
    <tbody>
        <tr>
            <td id="leftColTopTdImg"><img width="222px" height="77px" alt="" src="../leftcol_top.jpg" /></td>
        </tr>
        <tr>
            <td id="navLinksTD">
                <div id="navLinksBoxDiv">
                    <img id="navLinksBg" src="../menu_combined_2r.jpg" alt="The background for the navigation link box.  It has a vertical gradient going from light to dark and then dark to light blude" />
                    <ul id="navLinksInBox">
                        <li>
                            <a href="#">Driving While Intoxicated</a>
                        </li>
                        <li>
                            <a href="#">Sex Crimes</a>
                        </li>
                        <li>
                            <a href="#">2nd Driving While Intoxicated</a>
                        </li>
                        <li>
                            <a href="#">2nd Sex Crimes</a>
                        </li>
                    </ul>
                <!--End of navLinksBoxDiv-->                                                            
                </div>
                <img id="menuBottom" src="../menu_bottomedge.jpg" alt="The bottom of the menu" />
            <!--End of navLinksTD-->
            </td>
        </tr>
    </tbody>
</table>

我已经读过很多关于在TD中放置绝对div的信息,但是在这种情况下,同样的技巧似乎不起作用。 如何将绝对定位的img放入td中? 谢谢。

===============>>#1 票数:0

不看结果就很难看清问题所在,但是我马上注意到了一些事情:

您尚未设置绝对位置图片的位置(即top:0; left:0;)...这很可能是图片消失的原因

您还没有为图像本身指定padding&margins为0。

如果是表本身引起了问题,您也可以尝试:table {border-collapse:collapse;}以确保边框被折叠而不留间隙。

  ask by ermSO translate from so

未解决问题?本站智能推荐:

2回复

为什么在img和td之间插入5px [重复]

这个问题已经在这里有了答案: 如何避免img和td底部之间出现白线? 1个答案 这是代码: 小提琴 我相信我已经删除了所有间距,但是td仍然为305px ,而img为300px height 。 即使我尝试: 要么 在包含的<
1回复

链接到内部的img 不工作

我在点击并打开表格内的图片时遇到了一个大问题。 我创建了mysql数据库,并通过php在我网站上的表中实现。 一切正常,除了图像。 它们在桌子上显示为缩略图(应该是,因为我把高度很小),但是当我单击它们时,什么也没有发生,只是不想在图像所在的位置去(即使图片的链接显示在浏览器底部,并且我的
2回复

图中的路径 显示但无法单击

我在数据库填充表中单击并打开图像时遇到了很大的问题。 我创建了一个MySQL数据库,并通过PHP在我网站上的一个表中实现了它。 一切正常,除了图像。 它们以缩略图形式显示在桌子上(应该是,因为我把高度很小),但是当我想单击它们时,什么也没有发生。 它只是不想去图像所在的位置(即使图像的链
1回复

自动拉伸甚至在en edm上的td内重复img(html电子邮件)

制作edm(html电子邮件)时出现问题。 可以在这里找到代码jsfiddle.net/4Mss8/ 问题是img标签中的img不会扩展(拉伸)到android gmail客户端中各列之间的最大td高度,但是在任何边缘浏览器中都可以。 由于中间td的高度是动态的,因为里面的内容不是固定
3回复

css 3图片在td

我在将3张图片添加到CSS的表格单元时遇到问题,并且想知道是否有人可以帮助我弄清楚我在做什么错。 这是我所拥有的: CSS HTML 但是,当我打开页面时,我得到的只是一个显示“示例”的单元格,没有背景图像。 有什么建议么?
5回复

拉伸图像以适应td

我想在我的td单元格中拉伸图像。 怎么做。 它是一个标签图像,看起来像这个| ________ |倒置。 我需要将图像放在第一个td单元格中,其中包含文本'aaa'将出现在此图像的中心。
1回复

将内嵌图像显示为td

我只想在表格中显示我已放入TD中的内联3个图标,但找不到解决方法。 我得到以下代码: 而且我总是将结果显示在块中。 我从img和ul li的td中试用了它,并与display:inline一起使用,但是在这里没有带i标签的td。 有人可以帮我吗?
1回复

用CSS覆盖HTML img

我的jpeg是以前自我的像素化肥胖外壳...是否可以使用CSS样式表实际覆盖html img高度/宽度代码,而不是仅仅拉伸已经调整过的图像? 我问的原因是客户让我使用Godaddy的快速购物车(邪恶)工作。 它生成的代码更改html中图像的大小。 Godaddy仅允许CSS更改,这是我设法
5回复

> 在 没有空格
我试图将两个图像并排放置在<td> (每个img也尝试了一个<td> ),但是图像之间有一些空白,并且不知道它们的位置..我可以解决我的问题使用float,但我正尝试避免这种情况。 如果有人可以向我解释为什么会这样。 我从其他问题中吸取了一些技巧,但这是行不通的。
3回复

>不必要的照片旋转

我使用HTML5将图像嵌入表格中。 图像会自动逆时针旋转90度,并且没有应用CSS,也没有使用Javascript(过去是Java代码,因此某些标签上使用了class参数,但是我注释掉了<style></style>块中的<head> 。 该图像是由带有Imag