Html 用于将图元放置在图元上的绝对位置是否有替代方案？

这是我为每张图片创建的HTML

如您所见，类为

votingContainer

的图像和div都是

stickySpecificContainer

的子对象

stickySpecificContainer

是内联块，它获取其内容的宽度和高度，在本例中为图像。

votingContainer

使用position:absolute在左上角定位其父容器，在本例中为

stickySpecificContainer

现在，除了像my

stickySpecificContainer

这样的每个内联块都有默认的底部边距外，这一切都很好用

    <div class="home-container-element">
        <div class="stickySpecificContainer">

            <img class='home-image' src='' alt='Random image'>

            <div class='votingContainer'>
                <a href='#' class='' id=''></a>
                <a href='#' class='' id=''></a>
            </div>

        </div>
    </div>

---

只需在主容器上将字体大小设置为0

.home-container-element {
   font-size: 0;

.votingContainer {
   font-size: 12px;

并将其设置回您在投票容器上需要的位置

.home-container-element {
   font-size: 0;

.votingContainer {
   font-size: 12px;

这将删除块之间的空白

编辑：

---

在能够查看页面后，问题是主容器需要在Responsive布局中调整其宽度。当设置内联块时，子容器的宽度不再是100%，因此需要随它一起设置。为了删除内联块附带的底部边距，上述原始答案适用。

只需在主容器上将字体大小设置为0即可

.home-container-element {
   font-size: 0;

.votingContainer {
   font-size: 12px;

并将其设置回您在投票容器上需要的位置

.home-container-element {
   font-size: 0;

.votingContainer {
   font-size: 12px;

这将删除块之间的空白

编辑：

---

在能够查看页面后，问题是主容器需要在Responsive布局中调整其宽度。当设置内联块时，子容器的宽度不再是100%，因此需要随它一起设置。为了删除内联块附带的底部边距，上述原始答案适用。

您可以添加带有错误的实时视图或图像吗。我无法复制或理解是什么破坏了您的布局您可以添加一个实时视图或带有错误的图像吗。我无法复制或理解是什么破坏了你的布局。我可以在我的网站上向你展示它的样子。使用Admin作为用户名和密码，因为只有在登录时才能看到向上投票/向下投票。我的最终目标只是将投票div正确定位在左上角，但现在特定图像上的投票容器直接离开div，我不知道为什么会发生这种情况。当我将stickyContainer显示更改为内联块时；图像之间的差距无缘无故地扩大了。我可以在Chrome和IE中看到特定窗口大小的投票箱向外移动，而不是Firefox。但是，如果我在stickycontainer上设置inline block，我可以看到它在不影响图像之间间隙的情况下移动到它所属的位置。除非我改变页面缩放，但我想这不是问题所在。我正在1920x1080显示器上的谷歌浏览器上查看。当我在stickyContainer上设置inline block时，由于某种原因，某些元素之间的10px列间距至少会扩大到40-50px。我已经更改了代码，应该是实时的。你不也看到了吗？现在我抓到你了。设置宽度：100%；是的，这解决了列间距和votingContainer的问题，但是现在由于stickyContainer是内联块，我的下边距比内联块大了几个像素。我已经设置了底部边缘为10px，但现在似乎是14px左右。我可以在我的网站上展示它的外观-。使用Admin作为用户名和密码，因为只有在登录时才能看到向上投票/向下投票。我的最终目标只是将投票div正确定位在左上角，但现在特定图像上的投票容器直接离开div，我不知道为什么会发生这种情况。当我将stickyContainer显示更改为内联块时；图像之间的差距无缘无故地扩大了。我可以在Chrome和IE中看到特定窗口大小的投票箱向外移动，而不是Firefox。但是，如果我在stickycontainer上设置inline block，我可以看到它在不影响图像之间间隙的情况下移动到它所属的位置。除非我改变页面缩放，但我想这不是问题所在。我正在1920x1080显示器上的谷歌浏览器上查看。当我在stickyContainer上设置inline block时，由于某种原因，某些元素之间的10px列间距至少会扩大到40-50px。我已经更改了代码，应该是实时的。你不也看到了吗？现在我抓到你了。设置宽度：100%；是的，这解决了列间距和votingContainer的问题，但是现在由于stickyContainer是内联块，我的下边距比内联块大了几个像素。我已经设置了底部边缘为10px，但现在似乎是14px左右。