1

Firefox では、フッターのリンクのクリック可能な領域は非常に小さいです。クリック可能な領域は、幅と高さの両方に関して、ラベル全体には及びません。IEでは問題ありません。何か案は？

ここに私のフッターコードがあります:

<div id="footer">
<ul>
<li>RKM Research and Communications, Inc.&nbsp;&nbsp;|</li>
<li>1039 Islington St&nbsp;&nbsp;|</li>
<li>Portsmouth, NH  03801&nbsp;&nbsp;|</li>
<li>603.433.3982&nbsp;&nbsp;|</li>
<li><a href="mailto:info@rkm-research.com">email us</a></li>
</ul>
<ul class="copyright">
<li>&copy; 2012 RKM Research and Communications, Inc.   </li>
<li><a href="privacy.html">Privacy policy</a> </li>
<li><a href="terms.html">Terms of use</a></li>
</ul>

そして私のCSS：

div#footer ul li{
color : #036;
background-color : transparent;
display: inline
}

div#footer ul li a{
color : #115EAC;
text-decoration : none;
display:inline-block;
paddding:10px 20px;
}

.footer ul li a:hover{color:#F6901E;
text-decoration : underline;
}

クラスを使用してブロックスタイルを適用しようとしましたが、それでも役に立ちませんでした:

<li class="flink"><a href="mailto:info@rkm-research.com">email us</a></li>
</ul>

CSS:

.flink ul li a{
color : #115EAC;
text-decoration : none;
display:block;
paddding:10px 20px;
float:left;
}
4

1 に答える 1

0

小さな世界、私もポーツマスに住んでいます。

あなたが提供したコードでは、クリック可能な領域は本来あるべきものです。ここでこれを確認できます: http://jsfiddle.net/cCDaL/1/

各要素の背景をa黄色にしたので、クリック可能な領域が何であるかを正確に確認できます。実際にそうあるべきです。

あなたの問題に対する答えは、おそらくクリック可能な領域を小さくする別の CSS ルールがあることだと思いますline-height(paddingリンクではパディングはクリックできません)。Chrome または Firefox のインスペクタを使用して、ここで何が問題であるかを確認できます。

別の編集: Firefox Aurora 14.0a2 では、Web サイトhttp://www.rkm-research.com/のクリック可能な領域も実際には正常です。これは、Firefox インスペクターのスクリーンショットです。 ここに画像の説明を入力

于 2012-05-23T21:05:02.663 に答える