2012-04-26 6 views
0

FirefoxとIEでうまくいきますが、何らかの理由でSafariの座っている場所に座っているような色のブロックがあります画像参照)。CSS要素がSafariの予想位置より下に落ちる

enter image description here

私が間違ってやっているのような任意のポインタが、私はしばらくの間、このいじってきたようにいただければ幸いですし、それが仕事を得るように見えることはできません(?)

関連するCSSは次のとおりです:

//the element that represents the button that is floating 
//too low in safari: 

#addplacebtn { 
text-align: center; 
margin-top: 0em; 
margin-bottom: 0em; 
display: inline-block; 
width: 35px; 
float: right; 
background-color: #226083; 

} 

//the element that is containing the problematic element 

#edit-addplacebtn { 
height: 45px; 
width: 35px; 
top: 5px; 

} 

//the element containing the above element 

.tbrow { 
height: 35px; 
width: 285px; 
margin-bottom: 5px; 
margin-top: 5px; 
} 
+0

あなたのHTMLコードは何ですか? –

+0

投稿するjsfiddle –

+0

私の推測では、何らかの理由でボタンがかなり離れてしまっているのです。それ以外にも、 '#include addlinebtn'に' display:inline-block;と 'float:right;'があります。 'float'は' display'が何の効果も持たないことを意味します。たぶん 'float:left;'を試してみてください。また、 '#edit-addplacebtn'を配置しない限り、' top'は効果がありません。 –

答えて

0

まず、位置を絶対値に設定しようとすることができます。これにより、1つの位置に固定されます。

position:absolute; 

余白の代わりに2番目に左上を試してください。 cuz marginはすべてのブラウザで同じではありません。

left: 400px; 
top: 350px; 

それは、それだけで私はこれが役に立てば幸い:)

しようと、彼らはできるだけ多くのブラウザであるべき要素を取得するためにのろいがたくさんです! :)

ps。 (悪い英語のために申し訳ありません私はxDを理解することを願って)

+0

position:absoluteを使用することに注意してください。子要素には、相対位置が必要です。親の中で –

+0

ボタンを同じ行に置くことができますが、幅を30pxに減らす必要があります。私はコンテナの幅と要素そのものを編集しようとしましたが、それに合うように要素がたくさんあるように見えるにもかかわらず、Safariでは機能しません。私はまだ絶対的なポジションを試みていない。私は+記号のフォントサイズが30pxであることに気づいた。私はそれがちょうど偶然であるかどうか疑問に思っています(?) – Rowan

+0

まあ、私は応答するウェブサイトでまったく同じ問題を抱えています。私は "position:absolute;"と書いているのだろうかと思う。ウェブサイトの応答性がそれらのアイテムの作業を停止するようになりますか? – viriato

関連する問題