html - 内部元素对外部元素的固定位置

Question

我在这张图片的右下角有一张图片和一张支票图片。我想，当我调整窗口大小时，选中的图像仍位于外部图像的右下角。使用@media 查询非常复杂

<div class="row">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 list-parents-modal">
        <div class="parent-list-content-modal col-lg-2 col-md-2 col-sm-3 col-xs-4 alignCenter">
            <img ng-show="parent.check" class="img-check-modal" src="http://s22.postimg.org/mckimsgdp/tick_remove_parent.png">
            <img class="img-circle img-thumbnail img-thumbnail-modal" src="http://s23.postimg.org/yizg2hfgr/user_thumbnail_1.jpg">
        </div>
    </div>
</div>

我的 CSS

.list-parents-modal {
    height: 250px;
    overflow-y: auto;
}
.img-check-modal {
    position: absolute;
    width: 20px;
    margin-left: 105px;
    margin-top: 115px;
}

我的 fiddle :Fiddle

Answer 1

也许是这样？

.list-parents-modal {
    height: 250px;
    overflow-y: auto;
}
.img-check-modal {
    position: absolute; top: 50%; left: 50%;
    width: 20px;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
}

<link href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css' rel='stylesheet' type='text/css'>

<div class="row">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 list-parents-modal">
        <div class="parent-list-content-modal col-lg-2 col-md-2 col-sm-3 col-xs-4 alignCenter">
            <img ng-show="parent.check" class="img-check-modal" src="http://s22.postimg.org/mckimsgdp/tick_remove_parent.png">
            <img class="img-circle img-thumbnail img-thumbnail-modal" src="http://s23.postimg.org/yizg2hfgr/user_thumbnail_1.jpg">

        </div>
    </div>
</div>