4

私はcssを使用してアンカータグ（以下のcss）を使用してボタンスタイルを作成しています。コードはFirefox、Safari、およびChromeで正常に機能し、丸みを帯びた角が完全に表示されます。ただし、ie9では、ボタンの内側で奇妙なバンディングが発生しています。私が何を意味するかを示すために画像を添付しました。ボタンの約半分を通るこれらの線があります。それは本当に奇妙で、それが私だけであるかどうかを理解しようとしているときに見つけたチュートリアルのボタンにも表示されます。チュートリアルへのリンクは次のとおりです：http：//pythoughts.com/pure-css-buttons/

誰かがこれを引き起こしているものを知っていますか？ボタンの線を通して中央のdivの黄色の背景を見ることができるように、線は実際には透明です。これを修正する方法について、私はここで途方に暮れています。

css：

.button{
    padding:1px 5px;
    background:#cbebd3;
    color:#333;
    border:1px solid #98b99e;
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

私はそのようなスタイルを使用しています：

<a href="some-link.php" class="button">View Details</a>

これが画像です：

ボタンの問題

以下の提案に従って、jsfiddleでコードを試してみたところ、同じ結果が得られました。下に示された。 jsfiddleの問題

4

2 に答える 2

0

私のIE9（win 7）でもうまく機能します。アドバイスは1つだけです。border-radius、box-shadow、text-shadowのプレフィックスを追加する必要はありません。border-radiusbox-shadowtext-shadow（おそらくもっと多くのもの）がすべての最新のブラウザの標準になりました

于 2012-05-29T23:05:43.477 に答える
-1

追加する必要があるdisplay: block;か、float: left;そうでなければタグがインラインです

于 2012-05-08T10:29:22.207 に答える