IEのストレッチボタン

どういうわけか私はいつもこの問題を避けていましたが、今は疲れています。 一番下の行は、大きなボタンサイズのIEが「パン」を引き伸ばして、ある種のひどい不平を言うことです。







特に、隅の透明度の美しいアーティファクトに注意してください。



この状況から抜け出す方法は何ですか?



すぐに、どのような動作が予想されるかを予約します。







インターネットで解決策を探しましたが、オプションから、ボタンまたはその部分を写真に置き換えることをお勧めします(ただし、インターフェイスをブラウザーとシステムのスタイルに適合させたい!)または、CSSを使用して、ボタンをテキスト付きの長方形に変えます...つまり、ボタンのスタイルを少なくとも少し変更するとすぐに、システムのスタイルがすぐに失われます。



私は、ボタンのサイズに対するonさの依存性を明確に見ることができるページを作成しました(IEで)。



habrasocietyの妥当性を願っています。 ロバはとても頑固ですか?



更新:



すべて同じことができます! この問題の解決にご協力いただいた CurlyBracekostos、およびtelega2に感謝します!



ソリューション:



1) 問題の詳細な分析と次の解決策を含むIEのボタンの問題に関する記事:

/ * IEストレッチボタンバグの回避策* /



input.button {

パディング:0 .25em;

幅:0; / * IEのみ* /

オーバーフロー:目に見える;

}



input.button [クラス] {/ * IEは[クラス]を無視* /

幅:自動;

}




2)オプション:

入力{

パディング:0 5px;

幅:自動;

オーバーフロー:目に見える;

}


長さを短くすることで、ボタンにより多くのテキストを収めることが可能になります(私の「保存して続行」に合わせますが、さらに数文字とボタンが再び「浮く」)。



3)別のクラスを持つオプションは、原則として前のものと似ていますが、必要な場合にのみ使用でき、すべてのページ入力に影響を与えません

.long_button {

幅:自動;

オーバーフロー:目に見える;

パディング:0 .6em 0 .6em;

}




すべてのメソッドは、問題に対する部分的な解決策しか提供しません(一定の長さの後、ボタンは再び「浮き上がり」始めます)が、ボタンに適切な数の文字を収めることができます。



助けてくれてありがとう!



All Articles