如何使html元素及其内容扩展到页面顶部？

Question

标题几乎说明了一切，当在div中添加了额外的文本时，应将div的底部边框保持在同一位置，并且顶部边框应尽可能高以适应多余的文本。宽度是固定的。
我没有尝试过很多不同的事情，因为我找不到类似的东西。

编辑：之所以这样做，是因为我想将html元素的右下角锚定在铯查看器中的某个位置。目前，我只是固定宽度，但是我可以使用相同的宽度。右下角应将其位置保持在铯地图上的实体旁边。

Answer 1

如果您可以设置固定宽度，则可以使用position: fixed：

.tooltip {
  border: 1px solid black;
  bottom: 10px;
  padding: 15px;
  position: fixed;
  right: 10px;
  width: 200px;
}

<div class="tooltip">Lorem ipsum dolor sit amet, consectetur adip isicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>

Answer 2

通常，当使用绝对定位时，可以使用top和left的某种组合来代替使用bottom和right指定位置。执行此操作时，将从另一侧（分别是底部或右侧）开始测量坐标，因此，如果您具有基于左上角的坐标，则必须从该区域的宽度或高度中减去它们。

这里是a demo。在这里修改过的片段看起来像这样：

    // Set the HTML position to match the entity's position.
    testElement.style.right =
        (viewer.container.clientWidth - position2d.x) + 'px';
    testElement.style.bottom =
        (viewer.container.clientHeight - position2d.y) + 'px';

其余部分与this answer相同，只是更新为使用right和bottom而不是top和left。