2011-07-19 7 views
19

トライデント<=9内側のパディングアクティブへの要素のようなものを追加しているようです。Internet Explorerのボタン:アクティブな内部パディング

機能を無効にすることはできますか?

note: this is just a example, not a real world screenshot

+2

うん。それはIEでボタンがどのように機能するかです。これは、GUIウィジェット用の3DエフェクトのWindowXPスクールからのものです。その効果を望まない場合は、 'button'要素を使わないでください。 – Spudley

+0

それはトライデントの "機能"ですか? – mate64

+2

「テキストの動き」は正常ですが、スクリーンショットではテキストが正常以上に移動したようです。それは通常、約1ピクセルだけ上下に移動します。あなたのHTML/CSSは何ですか?それを含む[jsFiddle](http://jsfiddle.net/)が役に立ちます。 IEのどのバージョンですか? – thirtydot

答えて

17

更新:IE11 +、it can be removedについては


いいえ、古いバージョンのInternet Explorerでは削除できません。 @Spudleyとして

は言った:あなたがその効果をしたくない場合は、button要素を使用していない

それは本当に重要ならば、a要素が唯一の選択肢であるが、それは本当にただこの問題を解決するためにを切り替える価値はありません。 Internet Explorerのユーザーはそれに慣れています。

+0

ありがとうthirtydot!希望のmsは一般的なバージョンでこの機能を削除します。敬具。 – mate64

+4

これにはセマンティックマークアップの解決策がありますか? –

+0

実際には、ウェブサイトに影響を与えるアクションのためにボタンを使用することをお勧めします。そして、まったく影響を与えないアクションのリンク。 ([ボタンまたはリンクを使用するタイミング](http://uxdocs.jp/buttons/when-to-use-a-button-or-link/) – rappongy

16

Microsoft Internet Explorer 11+で修正できます。ボタンの内部要素にposition: relativeを使用します。

HTML:

<button><span>Submit</span></button> 

はCSS:

button > span{position:relative} 

お楽しみください!

+0

** - 1これは、トライデントのバージョンでは機能しません10.xの背後にある!** – mate64

+5

+1これはIE11でテスト済みです。 IEの少なくともいくつかのバージョンのソリューションを用意することは素晴らしいことです。 – Qtax

+0

これはまた少しのバリエーションを助けることができますhttp://stackoverflow.com/questions/20203225/remove-3d-press-effect-internet-explorer-button –

0
<button><span>Submit</span></button> 

button:active > span { 
-ms-transform: translate(0px, -0.5px); 
}