如何使两张图像保持相对？

Question

我想把底部的两个标识绑在一起，这样它们就相对于文字位于相同的位置。

我最好更喜欢某种解释以及代码，所以我可以从中学习。

相关HTML：

<div id="twitterdiv"><img id="twitter" src="images/Twitter_white.png" ></div>
<div id="instagramdiv"><img id="instagram" src="images/instagram_white.png"></div>

相关CSS：

#instagramdiv {
    right: 50%;
    position: absolute
}

#twitterdiv {
    position: absolute;
    right: 55%;
}

Answer 1

这里绝对定位的元素将起到作用。事实上，这是典型的情况，必须定位一个元素，例如＆＃34;粘性＆＃34;与其他一些人有关。记住绝对位置的定义＆＃34;元素相对于其第一个定位（非静态）祖先元素＆＃34;定位，你需要做的就是包裹你的＆＃34; l＆＃34;字母和图像在同一个容器（父级）中，然后给父容器相对位置和图像 - 绝对位置，最后设置左侧和顶部属性（如果需要）：jsfiddle

<div>app<span class="parentContainer">l
    <div class="positionedContainer">
                <img id="twitter" src="images/Twitter_white.png"/>
                <img id="instagram" src="images/instagram_white.png" />         
         </div>
    </span>
elemontomato</div>