Question

问题：

如何摆脱第一张图片中显示的空间？

更多信息和代码：

我有一个联系人列表，我想安排在另一个上面。当用户将鼠标悬停在联系人姓名上时，会弹出一张联系人卡片。在联系人卡片上，我想要一个电子邮件图标。

当电子邮件图标位于右上角时 - 没有问题。但是，当我添加填充以将其移动到联系人卡片的右下角时，页面首次加载时，联系人名称之间会出现一个奇怪的空间。然后，在我鼠标悬停并出现联系人卡片后，奇怪的空间消失，联系人列表以我希望它出现的方式显示

这是我的代码：的 HTML：

<div id="ball">
      <div id="thisisatest" onmouseover="showIt('/images/em.png', 'tomJustice')" onmouseout="hideIt('tomJustice')" >       
            <img src="/images/bluesquare.png" height="15" width="15" ></img>     tom Justice
            <img src="" id="tomJustice" style="margin-left: auto; overflow:hidden; padding-top: 20%" onclick="showIt('/images/card22.png', 'tomJustice2')" onmouseout="hideIt('tomJustice2')">
            <img src="" id="tomJustice2" style="display:none"></img>
            </br>
      </div>
... other contacts
</div>

Answer 1

为什么你不只是给出一个

position:absolute;

和

right: 0; bottom: 0;

你可以在div中定位

删除奇怪的空间

1 个答案: