Css div表响应图像

我创建了一个基于div的表。我试着拍一张照片，把它放在左上角的表格单元格里，让它有反应。我已经让它响应了，但它不在我想要的表格单元格中。有什么帮助吗

JSFiddle：

HTML

删除位置：绝对或将顶部：0添加到.rspimg1。

使用背景图像时，div不会随图像增长，因此您需要为单元格或图像div指定一个高度/宽度。顺便说一句，我将您的p更改为div，因为p代表文本而不是图像

在下面的示例中，我非常确定您的目标是什么，如果不是，请给我留言，我会为您修复它

html，正文{ 保证金：0； 身高：100%； } .hmTable{ 保证金：0自动； 显示：表格； 宽度：50%； 身高：30%； } .hmTableRow{ 显示：表格行； 身高：10%； } .hmTableCell、.hmTableHead{ 显示：表格单元格； 宽度：50%； 身高：100%； 边框：1px实心99999； } .rspimg1{ 背景：urlhttps://upload.wikimedia.org/wikipedia/en/thumb/3/39/Red_triangle_with_thick_white_border.svg/1152px-Red_triangle_with_thick_white_border.svg.png 中心不重复； 背景尺寸：包含； 宽度：100%； 身高：100%； } .rspnimg2{ } 三角形 广场 文本持有者 文本持有者

    <div class="hmTable">
        <div class="hmTableRow">
            <div class="hmTableCell"><p class="rspimg1"></p></div>
            <div class="hmTableCell"><p class="rspimg2"></p></div>
        </div>
        <div class="hmTableRow">
            <div class="hmTableCell">textholder</div>
            <div class="hmTableCell">textholder</div>
        </div>
</div>

 .hmTable { 
                margin: 0 auto; /* or margin: 0 auto 0 auto */
                display: table;
                width: 50%;

        }
.hmTableRow {
                display: table-row;
        }

.hmTableCell, .hmTableHead {
                display: table-cell;
                width: 50%;
        height:100%;
                border: 1px solid #999999;
          position:relative;


        }

.hmTableBody {
                display: table-row-group;
        }
.rspimg1{
      background-image: url("https://upload.wikimedia.org/wikipedia/en/thumb/3/39/Red_triangle_with_thick_white_border.svg/1152px-Red_triangle_with_thick_white_border.svg.png");
      background-repeat:no-repeat;
      background-size:100% 100%;
      width:100%;
      height:100%;
      position:absolute;

 }

.rspnimg2{

}