绝对定位到非父容器答案

【问题标题】：Position absolute to a non-parent container绝对定位到非父容器
【发布时间】：2025-12-20 21:20:17
【问题描述】：

我有以下 div：

<div id="container"></div>
<img id="myimg" src="myimage.jpg" />

我需要将图像放置在容器顶部和左侧的绝对位置，但是我的图像无法放置在容器内：

img
{
  position: relative;
  top: 10px;
  left: 15px;
}

如何修改图像 css 来实现这一点？

【问题讨论】：

这在很大程度上取决于 DOM 结构，以及已经应用的其他格式。请创建一个minimal reproducible example 来说明您需要处理的情况。
您的 div 没有 <img> 标签。为什么id后面没有=？它应该是id="container"。 oyu 可以将您的 html 和 css 更新为一个工作示例吗？
为什么不能在容器内？请更详细地展示您的示例。
@Kyon147 它是一个动态创建的 div。我不能手动把它放进去
它是如何动态创建的？如果它是在您的网站上创建的，您应该能够访问它。这样，例如，如果您使用 javascript，您可以选择它的去向。

标签： css

【解决方案1】：

如果您希望 img 位置位于 div 内部，则需要使 pic 绝对和父 div 相对，这样顶部、左侧等将从父 div 的开头而不是 body 开始。

我希望这能回答你的问题，我不确定我是否理解正确。

【讨论】：

可以，但是图片不能放在div里面
不能放置是什么意思？你到底是怎么把它放在那里的？你可以在这里发布一个例子吗？
是动态创建的div。我无权访问代码
然后，如果您知道 div 存在，您可以选择它并根据您使用的 vanilla js/jquery/某些框架动态注入带有 innerHTML 或类似内容的 img
我正在使用 JQuery。这听起来像我需要的

【解决方案2】：

将您无法控制的 div 包装在您可以控制的 div 中。给你控制的 div 位置：相对和图像位置：绝对。您无法控制的内部 div 将强制您控制的内部 div 的高度/宽度。

<div id="containerYouControl">
     <div id="container">
     </div>
     <img id="myimg" src="myimage.jpg" />
</div>

【讨论】：

【解决方案3】：

用 JQuery 回答：

 <script type="text/javascript">

  $(document).ready(function() { 

  var html ='<div id="animaBorder" style="left: 250px; top: 20px;"><img src="myimage.jpg" /></div>';

  $("#container").append(html );

  });

 </script>

【讨论】：