我有一个图像内aboslute div。我希望图像是响应和最大宽度100%（自己的宽度）。
下面的代码可以很好地工作，但是只有当我在. item上添加宽度：100%时。我不希望这样，因为它会阻止后面的任何潜在内容（不接受z索引或指针事件）。我不能在换行时使用flex，因为我有多个子项需要单独对齐。
如果我删除宽度：100%在'. item'，然后当我调整大小和缩小窗口，'.item'缩小，使图像比它实际上可以更小.如果有一个css的解决方案？

.wrap {

}

.item {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
  width:100%;/* this makes item width 100% of parent, I dont want that. If I remove it, image size gets smaller as window shrinks */
  max-width: 100%;
}

.item img {
  max-width: 100%;
  display: block;
  margin: auto;
}

<div class="wrap">

  <div class="item">
    <img src="https://via.placeholder.com/350x150" />
  </div>

</div>