サイトがwww経由で直接アクセスしていて、@

Question

で直接アクセスしているときに、CSSの動作が異なります。私のサイトで見ている問題で非常に混乱します。

「www」でサイトにアクセスすると、すべてが期待どおりになり、自分のローカル開発環境と一致します。 CSSはスポットライトです。

ドメイン名だけで同じサイトにアクセスすると、フォントの種類が大きくなりサイトが醜いものになります。誰も似たような問題を経験しましたか？

多分私は100のものが私のために今飛び回っているので何かを見逃しています。

問題になっているのURL：

http://www.connect4fitness.com 
http://connect4fitness.com 

そして、はいDNSエントリが正しいです。両方のURLは同じページを提供する必要があります！

Answer 1

間違ったズームレベルで表示しているようです。どのブラウザを使用していますか？フォントが大きいバージョンでは、100％ズームレベル（通常これはCtrl + 0（ゼロ））またはCtrl +（プラスまたはマイナス+/-最近のブラウザでは、特定のサイトの最後のズームレベルが記憶されているため、サブドメインを区別することができます。http://connect4fitness.comのみを記憶します。

Answer 2

@font-faceあなたのCSSのルールは、フォントへのパス（複数可）、彼らは、あなたがこれを表示している場合同一生成元ポリシーようになっている。例えば

呼ばれる—これを要求している元のドメインと一致する必要がページ：

http://example.com/about 

とフォントからCSSを経由して提供されています：あなたは同一生成元ポリシーとブラウザに遭遇します

http://www.example.com/css/screen.css 

CSSで指定したフォントがあるので、フォントファイルを（ダウンロードしないだろうが別のドメインから配信されています覚えておいてください、wwwのようなサブドメインは技術的に別のドメインとみなされます）。問題を解決する最も簡単な方法に

は（../）の相対的または絶対パス（/）を使用して、あなたのCSSでのフォントにリンク、そして、すべての可能な場合は、サイトのFQDNを使用しないように..ですグッド

（相対）：

@font-face { 
    font-family: 'MyWebFont'; 
    src: url('../fonts/webfont.eot'); 
    src: url('../fonts/webfont.eot?#iefix') format('embedded-opentype'), 
     url('../fonts/webfont.woff') format('woff'), 
     url('../fonts/webfont.ttf') format('truetype'), 
     url('../fonts/webfont.svg#svgFontName') format('svg'); 
} 

ベスト（アブソリュート）：

@font-face { 
    font-family: 'MyWebFont'; 
    src: url('/fonts/webfont.eot'); 
    src: url('/fonts/webfont.eot?#iefix') format('embedded-opentype'), 
     url('/fonts/webfont.woff') format('woff'), 
     url('/fonts/webfont.ttf') format('truetype'), 
     url('/fonts/webfont.svg#svgFontName') format('svg'); 
} 

悪い（FQDN）：

@font-face { 
    font-family: 'MyWebFont'; 
    src: url('http://example.com/fonts/webfont.eot'); 
    src: url('http://example.com/fonts/webfont.eot?#iefix') format('embedded-opentype'), 
     url('http://example.com/fonts/webfont.woff') format('woff'), 
     url('http://example.com/fonts/webfont.ttf') format('truetype'), 
     url('http://example.com/fonts/webfont.svg#svgFontName') format('svg'); 
}