Css 可变Div大小。右上角

我有一个布局，屏幕的50%（左-右-非上-下）被地图占据，另外50%被内容占据

---

我有10个div，其中包含可变长度的文本，我想在每个div的右上角放置一些内容。文本是动态生成的，因此我无法判断div的大小

<p id="contents">
  <div id="contentDiv">
  blah blah blah blah
  <div id="positionedthing">Thing I want positioned</div>
  </div>
  <div id="contentDiv">
  blah blah balh blah
  <div id="positionedthing">Thing I want positioned</div>
  </div>
</p>

---

但是它相对于整个页面而不是每个单独的分区进行定位。

如果您定位某个绝对值，则需要将其父项设置为相对值。让div内容尊重定位div内容的唯一方法之一是浮动它们

这是我对你想要的最好的打赌。

---

请注意，当您有多个项时，需要使用类。ID是唯一的标识符，因此您可以期望document.getElementById（“ID”）始终只返回一个元素。

使用

位置：绝对

为了在父对象中定位绝对对象，最简单的方法是应用

位置：相对到它

但是，首先，您应该重新考虑您的标记。最重要的是：ID应该是唯一的。因此，您的
contentDiv
和
positiondthing
应该是类，而不是id:

<p id="contents">
<div class="contentDiv">
blah blah blah blah
<div class="positionedthing">Thing I want positioned</div>
</div>
<div class="contentDiv">
blah blah balh blah
<div class="positionedthing">Thing I want positioned</div>
</div>
</p>


我不确定这是不是你想要的，我只是把你需要的东西放到右边，
并添加了一些显示css。但不要将id用于多元素使用类。或者它会在某个时候破裂

.positionedthing {float:right;}

“文本是动态生成的，所以我无法判断div有多大。”--是的，你可以：JavaScript。所以你试图在div中定位一些内容，这些内容在中，ID必须是唯一的。@TylerH-OP说他的CSS有“p#contents is display:inline”。原因不得而知。静态以外的位置（默认值）将为其子体建立新的“包含块”。通常情况下，您会对此类用例使用
relative
，因为相对定位不会将元素从正常流中移除。您应该将它们浮动，这样它们就不会隐藏其父级内容，请参见我的解决方案：）我认为依赖者实际上想要坚持的位置。我想到了一些像箭头一样的东西，在一些wordpress评论中包含“author”一词。在这种情况下，我会使用我的解决方案和填充。在其他情况下-是的，你的回答是，地图在另一边，所以右浮动不起作用，我想：（右浮动，在父对象内部，所以应该起作用。让我看看我是否能修复那个小提琴手
.contentDiv {
    position:relative;
}

.positionedthing {
    position:absolute;
    top:0;
    right:0;
}

.positionedthing {float:right;}