6

これは GWT アプリの DOM の一部です。<span>は矢印を表し、その<div>すぐ下にある は正方形を表します。コードが繰り返されているため、これは正しく描画されています: ARROW1 SQUARE1 ARROW2 SQUARE2

Square1にはスケーリング スタイルがあるため、実際には よりも大きく、Square2Arrow2 と重なる必要があります。これが問題です: Square1OVER と表示されるはずですArrow2(そのため、z-index:1and Arrow2' z-index:0)。ただし、これは逆です。Arrow2 は Square1 の上に表示されます。

これは Google Chrome で発生していますが、IE9 では正常に動作します。何か案は？ありがとう！

<div style="width:489PX;margin-left:auto;margin-right:auto;">
  <div style="cursor:pointer;">
    <div id="p379ehovd03-1" style="z-index=1;">
      /***** ARROW 1 BELOW *****/
      <span id="p21023d9223" style="z-index=1;"></span> 
      /***** SQUARE 1 BELOW *****/
      <div id="qu39rtgh93he-1" style="width:126PX;height:100PX;z-index=1;-moz-transform: scale(1.1, 1.1);-webkit-transform: scale(1.1, 1.1);-o-transform: scale(1.1, 1.1);-ms-transform: scale(1.1, 1.1);transform: scale(1.1, 1.1); -moz-transform-origin: center center;-webkit-transform-origin: center center;-o-transform-origin: center center;-ms-transform-origin: center center;transform-origin: center center;z-index: 1">
        <p>adsfadsfasdfa</p>
      </div>
    </div>
  </div>
  <div style="cursor:pointer;z-index:0;">
    <div id="p379ehovd03-2" style="z-index:0;">
      /***** ARROW 2 BELOW *****/
      <span id="p2782bhsd29" style="display:block;z-index:0;"></span>
      /***** SQUARE 2 BELOW *****/
      <div id="qu39rtgh93he-2" style="width:126PX;height:100PX;"> 
        <p>adsfadsf</p>
      </div>
    </div>
  </div>
</div>
4

3 に答える 3

4

Square1 の DIV にposition: absoluteを追加して動作しました。

于 2012-11-23T16:05:08.873 に答える
4

位置の追加は、絶対的または相対的に関係なく機能します

于 2016-07-28T19:14:04.263 に答える
2

これを span 要素に追加します。

display:block;
于 2012-11-23T15:42:47.600 に答える