0

次の CSS クラスで動作が定義されている JSP ページに DIV 要素があります。

.toolbarRight .shortcut {
background-position: left center;
background-repeat: no-repeat;
width:16px;
height:16px;
margin:0 8px 0 0;
display:inline;
cursor:pointer;
position:relative;
top:6px;
float:left;
border:none;
}

span.toolbarRight .export {
background-image: url('/images/excel.gif');
}

したがって、基本的にマウスでホバーすると、ポインターに変わります。問題は、要素の下部 1/4 のポインターにのみ変更され、上部の 3/4 では変更されないことです。問題の説明については、下の写真を参照してください。

写真 1: マウス カーソルが Excel アイコンの下 1/4 の上にあります (ポインタに変わります):

ここに画像の説明を入力

写真 2: マウス カーソルが Excel アイコンの 3/4 の上にあります (ポインタに変わりません):

ここに画像の説明を入力

奇妙なもう 1 つのことは、2 つの DHTMLX グリッドを含む現在の画面構成でのみ発生することです。1 つは画面の上半分に、もう 1 つは画面の下部にあります (下の図を参照してください。問題が発生する Excel アイコンは黄色で囲まれています)。 :

ここに画像の説明を入力

3 つのグリッド (水平 2 つと垂直 1 つ) がある場合、問題は発生しません。

ここに画像の説明を入力

これは何が原因か分かる人いますか?

4

3 に答える 3

1

他の答えは正しいかもしれませんが、ここでフロートの問題が発生する可能性もあります。

を適用することで、親コンテナにフロートされた子を強制的にラップさせることができますoverflow: hidden;。それを試してみてください。失敗した場合は、 clearfixを使用してください。

.toolbarRight .shortcutまた、クラスをに設定しているため、クラスの幅と高さが固定されるかどうかもわかりませんdisplay: inline。物に幅と高さを適用する必要がある場合は、インラインブロックまたは単純な古いブロックを試してください。

于 2013-02-18T22:32:22.140 に答える
1

通常、この問題が発生するのは、別のアイテムのパディングがツールバー (または他の何か) に重なっているからです。下の 1/4 が見えるので、オッズはその上の何かが少し下に重なっています。

于 2013-02-18T22:30:11.477 に答える
0

それはあなたです

位置:相対; top:6px;

コンボ-要素はあなたが思っているよりも6px低くなっています。画像は上にあるかもしれませんが、コンテナは上にありません。画像のコンテナではなく、画像にポインタを移動します

于 2013-02-18T22:31:21.073 に答える