0

私は自分のウェブサイトのフッターを持っています。そこには、その下に画像があるリンクがあり、これらの重複を含む別々の div があります。画像とリンクが重なっている場所では、リンクをクリックできません。

関連するコードを抽出して JSFiddle を作成するには少し時間がかかる場合があるため、画像を投稿しています。これらに基づいて誰かが私を助けてくれることを願っています:

footer_infoリンクを含む div :

ここに画像の説明を入力

footer_row_0画像を含む div :

ここに画像の説明を入力

私のシナリオでは、次のリンクは機能しません。

Privacy Policy
Terms & Conditions
Site Map
Affiliates
Specials
Wish List
Newsletter

z-index: 10の設定はすでに試しましfooter_infoたが、問題は解決しませんでした。に負のz-index値を設定するfooter_row_0と、行が消えます。

footer_info計算された CSS:

background-color: rgb(255, 255, 255);
background-image: none;
background-position: 50% 0%;
background-repeat: no-repeat;
clear: both;
color: rgb(84, 84, 84);
display: block;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
font-size: 12px;
height: 149px;
line-height: 18px;
margin-bottom: -75px;
overflow-x: auto;
overflow-y: auto;
padding-bottom: 20px;
padding-left: 0px;
padding-right: 0px;
padding-top: 20px;
width: 980px;
z-index: auto;

footer_row_0計算された CSS:

color: rgb(224, 224, 224);
display: block;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
font-size: 12px;
height: 150px;
line-height: 18px;
position: relative;
width: 980px;
z-index: 0;

誰かがこの問題を解決する方法を教えてもらえますか?

4

3 に答える 3

1

これに1〜2時間費やした後、解決策を見つけることができました。まず、@Broken Heart の助けに感謝します。私の答えは部分的に彼に基づいているからです。また、私はポイントや何かを得るために自分の答えを作っているわけではありません (あまり気にしないでください) が、私はそうしているだけなので、この問題に固執している他の人も解決策が何であったかを見ることができます.

さて、最初にこの CSS をfooter_info divに適用しました。

#footer_info {
    z-index: 1 !important;
    position: relative;
}

小さなシルエットの画像には、CSS クラスのシルエットもありました。そこで、シルエットCSS クラスに以下を追加しました。

.silhouette {
    z-index: 2;
}

この 2 つの変更により、リンクをクリックすることができ、シルエット画像も完全に表示されました。

于 2013-09-19T12:26:52.620 に答える
1

footer_infoでは、次のように z-index を使用しますposition。

この css をfooter_info div に追加します。

position: absolute;
z-index:999 !important;

z-index は position プロパティで機能しました。

于 2013-09-16T09:06:57.867 に答える