Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>1) Like Jukka K. Korpela says, there is no CSS that actually uses the font.<br> 2) The strange rendering you experience is the browser that tries to fake the bold style. </p> <p>CSS:</p> <pre><code>@font-face { font-family: 'Frutiger'; src: url('frutiger.eot'); src: url('frutiger.eot?#iefix') format('embedded-opentype'), url('frutiger.woff') format('woff'), url('frutiger.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Frutiger'; src: url('frutiger-bold.eot'); src: url('frutiger-bold.eot?#iefix') format('embedded-opentype'), url('frutiger-bold.woff') format('woff'), url('frutiger-bold.ttf') format('truetype'); font-weight: bold; font-style: normal; } /* You did this inline with style="...". */ /* The font from the first @font-face */ p { font-family: Frutiger; } /* Gets the bold font from the second @font-face */ strong { font-weight: bold; } .small { font-size: 13px; } .medium { font-size: 14px; } .large { font-size: 15px; } </code></pre> <p>HTML:</p> <pre><code>&lt;p class="small"&gt;ABCABC&lt;strong&gt;ABCDABCD&lt;/strong&gt;ASDFASDF&lt;/p&gt; &lt;p class="medium"&gt;ABCABC&lt;strong&gt;ABCDABCD&lt;/strong&gt;ASDFASDF&lt;/p&gt; &lt;p class="large"&gt;ABCABC&lt;strong&gt;ABCDABCD&lt;/strong&gt;ASDFASDF&lt;/p&gt; </code></pre> <p><strong>EDIT</strong></p> <p>The font's look fine on my machine (Mac, Firefox, Safari). woff files are used.</p> <p>Then I submitted the example.html to browsershots: <a href="http://browsershots.org/http://font-render-issue.herokuapp.com/example.html#" rel="nofollow noreferrer">http://browsershots.org/http://font-render-issue.herokuapp.com/example.html#</a><br> A lot of different outputs. Windows needs (better) hinting.</p> <p>The Grid Fit ('gasp' table) of the fonts have one entry. They both have one range defined at 65535, which is okay. </p> <p><img src="https://i.stack.imgur.com/NBwSA.png" alt="GASP"></p> <p>I also bumped into the copyright info. You might want to consider alternative fonts. ;) <a href="http://joelcrawfordsmith.com/new/font/frutiger" rel="nofollow noreferrer">http://joelcrawfordsmith.com/new/font/frutiger</a></p> <p>The two fonts are from the same release. But a local file may take precedence. You can disable loading local files with the font face smiley hack.</p> <pre><code>@font-face { font-family: 'Graublau Web'; src: url('GraublauWeb.eot'); src: local('☺︎'), url('GraublauWeb.otf') format('opentype'); } </code></pre> <p>This is all I can think off for now.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload