1

私はここにjsfiddleを持っています：http： //jsfiddle.net/asaakius/5nGYS/7/

この小さなdivに文字「v」が付いていることに気付くでしょう。$(#menu)このdivを削除すると、textareaとtextboxが必要に応じて配置され、両方のdivの位置が完全に同期してサイズ変更が行われます。

しかし、$(#menu)divを追加すると混乱します。小さなメニューdivを、の右上隅に$(#textarea)配置し、その中のテキストを乱したり、との配置を乱したりしないようにし$(#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

より高いz-indexを持つために、divの位置を相対とオーバーラップさせることはできません。メニューdivでposition：absoluteを使用する必要があります。そして右に作る：0; 右に固執する。オプションで、メニューdivに高いz-indexを適用します。例を参照してください：http：//jsfiddle.net/5nGYS/10/

于 2012-09-01T08:55:00.803 に答える
0

記録のために、レイアウトを変更する場合にposition使用できます。relative

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

ゼロ-edborderとpadding。

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