2012-04-27 14 views
0

私は2つの異なるブラウザに問題があります。私はimage1の取得次のCSSを使用する場合 ::私は、問題のスナップショットを添付しているChromeとFirefoxの余白の違いは何ですか?

.support-data-text img, .support-data-text select { 
float:left 
} 
/* this is for dropdown list */ 
form#saveSupport select { 
    height: 29px; 
    width: 234px; 
    position: absolute; 
} 

form#saveSupport input{float: left; width: 243px;} 

/* this is for the img we are using for dropdown list */ 
form#saveSupport .select_game { background: url(../images/select-status.png) no-repeat; 
    width: 223px; position: absolute; height: 29px; line-height:29px; 
    padding: 0 0 0 10px; color: #333; font-size:12px; overflow: hidden; 
} 

enter image description here

を、私はform#saveSupport .select_gamemargin-left: 18%を追加するときにChromeは、ドロップダウンリストの画像の適切なアライメントではなく、実際のドロップダウンを示していFirefoxはドロップダウンリストを右側に置き換えます。 (画像2)enter image description here

すみやかに解決策を教えてください。私は感謝しています!

おかげで、 ビクラム

+0

これをテストするための動作するURLを提供できますか? – frontendzzzguy

答えて

1

こんにちは、私はあなたが親要素にposition:relativeを設定し、子要素のためだと思うが、私はあなたの親本部が子供に設定し、この

.support-data-text{ 
position:relative; 
} 

、今だと思うposition:relative

を設定しましたdiv絶対位置と右上最下部あなたのデザインに応じて設定します。

+0

これは私が推測するより多くのトラブルを引き起こします:) –

関連する問題