クロスブラウザ@ font-face use

Question

私はカスタムフォントと@font-faceを使用して多くの問題を抱えてきました。私はクローム、サファリ& Firefoxの最新バージョン間で一貫性のあるフォントを取得しようとしている（下のスクリーンショットでは、この順序で示さ：

私はこれを生成するには、次の使用しています：

を

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

そして：私は目を低下させるためににフォントの太さのすべての荘園を試してみた

.menu-button a { 
    height:25px; 
    float:left; 
    border-bottom:2px solid white; 
    color:#ccccff; 
    text-decoration:none; 
    padding:8px 21px 0px 20px; 
    text-align:center!IMPORTANT; 
    background-color:#00378f; 
    font-size:18px; 
    font-family:'dineng', Arial; 
    text-shadow:0 0 1px rgba(0,0,0,0.3); 
    } 

重量はですが、何も影響しません。私はそれが私のPSDのように見えるようにそれが他のブラウザーでは動作しません取得するにはChromeで以下のハックCSS3を使用しました：

text-shadow:0 0 1px rgba(0,0,0,0.3); 

私は窓の外にジャンプする前に、誰もが何か提案を持っています！

私はフォントスクエレルを使用することができませんのでご注意ください！お使いのコンピュータ上の.TTFファイルを開き、そうでない場合

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

：

Answer 1

はこのようにそれを試してみてください。既に太字で表示されている場合は、フォントの通常の外観であるため、フォントのサイズを小さくすることはできません。