奇妙な私は、この単純化されたコードを持って、フローティングとIE7

でパディング：私はdiv要素は、入力ボタンの周りに右にフロートをラップすることを期待奇妙な私は、この単純化されたコードを持って、フローティングとIE7

input.submit{ 
    padding-left: 40px; 
    padding-right: 40px; 
    float:right; 
} 
.container{ 
    background-color: #AAA; 
    float:right; 
    padding: 50px; 
}

：

<div class="container"> 
    <input type="submit" name="submit" class="submit" value="Sign Up"> 
</div>

そして、それのためのCSSを、そのサイズはボタンのサイズ+パディング（50ピクセル）と同じです。他のブラウザでは完全に動作しますが、IE7では2つの奇妙なことが起こります：

divの幅はウェブページ全体に広がっています。私がfloat：input.submitのCSSから右を削除した場合、divのサイズは正しいです。
入力ボタンの幅も他のブラウザでボタンを表示した場合よりもはるかに大きくなります。

これは私が使用するドキュメントの種類：これらの問題が起こるとどのようにそれらを解決するために、なぜ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

誰もが知っていますか？

出典

2011-09-17 Jack

なぜfloat: rightがinput.submitに必要なのかわかりませんので、削除してください。あなたがそれを必要とする理由があるなら、私に理由を示す必要があります - 回避策があるかもしれません。

overflow: visibleをinput.submitに追加してください。これら二つの変更後

、それはIE7とIE9に実質的に同じになりますhttp://jsfiddle.net/33vmm/

出典

2011-09-17 14:49:08 thirtydot

これが登録フォームからわずか簡略化されたコードです。私は、ボタンを他の要素と整列させるために、右に浮かべておきたい。オーバーフロー：表示が正常に動作します。ありがとうございました。これはIE7のバグですか？ – Jack

はい。 http://jsfiddle.net/を使用して登録フォームの詳細を表示できますか？ – thirtydot

ああ、あなたがログインしていないときはFacebookのホームページのサインアップフォームとほとんど同じですが、サインアップボタンは上のテキストボックスに合わせて右に浮かべます。 – Jack

奇妙な私は、この単純化されたコードを持って、フローティングとIE7

答えて

関連する問題