2012-05-06 11 views
0

bgの画像とリンクを含むブログのヘッダーにdivを入力しようとしています。 Chromeでは正しく表示されていますが、SafariやFirefoxでは正しく表示されません。私はAP div自体ではなく、シフトを引き起こす他の要素だと思っていますが、何が分からないのか、私はリセットを使用しています。AP divの位置がchrome、firefox、safariで若干異なります。

http://www.artyst-tyrant.com/blog

ここで私が使用しているCSSのです:

ここhttp://imgur.com/a/hP8dM

がウェブサイトへのリンクです:ここで

は私が話して何を示してスクリーンショットへのリンクです:

#trex-blog { 
margin-left: 435px; 
position: absolute; 
top: 50px; 
z-index: 50000; 

}が

#trex-blog a, #trex-blog a:visited, #trex-blog a:hover { 
background: url(../img/blog-trex.png) no-repeat scroll 0 0 transparent; 
display: block; 
height: 121px; 
width: 356px; 
font-size: 0; 
line-height: 0; 
overflow: hidden;  
text-indent: -9999px; 
} 

ここでは、コードに学んで彼の手をしようとしている貿易によってHTML

<div id="trex-blog"><a href="http://www.artyst-tyrant.com" title="Artyst Tyrant - Victor Beazzo Designer for Hire">Artyst Tyrant - Victor Beazzo Designer for Hire</a></div> 

デザイナーだが、私は決してプロでね、そう、簡単に行ってください。

ご協力いただきありがとうございます。本当にありがとうございます。

答えて

0

Win7のChrome v18では、他のブラウザと同じ場所に画像がレンダリングされます。クロムのみでキャッシュされたバージョンをブラウズしていた可能性はありますか?彼らは比較的位置付け要素内にラップされている場合

絶対位置決め要素への唯一の注意点がある - 私はあなたのソースコードを見て、任意の位置に気付かなかったhttp://css-tricks.com/absolute-positioning-inside-relative-positioning/

- 絶対位置は、親からの相対であります親要素の相対属性。

CSSのトップアトリビュートの値を20pxに調整しました。これは現在のすべてのブラウザで調整されています。

+0

それは他のすべてのブラウザで私のために修正されていますが、それでも私のためにクロームで見えます。私はすでにキャッシュをクリアしようとしました。クロムのヘッダーにはスペースがあるように見えますが、その理由はわかりません。 –

+0

奇妙なことに、すべての拡張機能を無効にしようとしています。次に、domインスペクタ、特にMetricsパネルを使用して、余分な余白の原因を突き止めます。 –

関連する問題