1

我在这里有一个 jsfiddle：http: //jsfiddle.net/asaakius/5nGYS/7/

你会注意到这个$(#menu)带有字母“v”的小 div，如果我删除这个 div，textarea 和 textbox 会根据需要对齐，并且调整大小时两个 div 的位置完全同步。

但是当我添加$(#menu)div 时它会变得混乱。我只希望小菜单 div 位于 的右上角$(#textarea)，而不会干扰其中的文本，也不会干扰 and 的$(#textarea)对齐$(#textbox)。我的意思是，我希望它在文本上方可见，就像它具有更高的 z-index 一样（它是一个小菜单的开头）。

编辑

我刚刚意识到，如果我保持菜单的位置：绝对，它就会留在容器中。但是如何保持它在右侧呢？我希望它始终位于右上角，无论调整大小。

4

3 回答 3

1

将#menu 的样式更改为：

#menu{ right: 0; color:red; position:absolute; }​

Float:right导致下一个 div 围绕它流动，position:absolute;使其完全脱离流动。

于 2012-09-01T08:51:12.433 回答
1

您不能将 div 的位置与相对位置重叠以获得更高的 z-index。您必须在菜单 div 上使用 position:absolute。并正确：0；坚持向右。可以选择将更高的 z-index 应用于菜单 div。见例子：http: //jsfiddle.net/5nGYS/10/

于 2012-09-01T08:55:00.803 回答
0

作为记录，如果您修改布局，您可以使用positionto 。relative

<div id="textbox" class="textbox" style="top: 10px; left: 10px;">
  <span id='menu'>v</span>
  <span Hello there
</div>

带零border和padding.

#menu {
  ...
  padding: 0;
  border: 0;
}​
于 2012-09-01T09:04:12.313 回答