Databases
StackOverflow2013
Postsdbo
PO@font-face rendering issue on paragraph tag, Chrome Android 4
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO@font-face rendering issue on paragraph tag, Chrome Android 4
    text
    copied!<p>I am running into a strange issue in Chrome on a Nexus 7, Android 4 tablet.</p> <p>When I try to style a <code>p</code> tag with a web font, the font will not render until it is after a certain <code>em</code>or <code>px</code> size:</p> <p>The CSS:</p> <pre><code> @font-face { font-family: 'mija'; src: url('/assets/fonts/mija-reg/mija-reg.eot'); src: url('/assets/fonts/mija-reg/mija-reg.eot?#iefix') format('embedded-opentype'), url('/assets/fonts/mija-reg/mija-reg.woff') format('woff'), url('/assets/fonts/mija-reg/mija-reg.ttf') format('truetype'), url('/assets/fonts/mija-reg/mija-reg.svg#mija') format('svg'); font-weight: normal; font-style: normal; } p { font-size: 16px; font-family: 'mija' } </code></pre> <p>And my HTML:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html &gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;meta name="description" content=""&gt; &lt;/head&gt; &lt;body&gt; &lt;p&gt;Hello world&lt;/p&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>In this instance, anything <code>17px</code> and above will correctly render the font.</p> <p>This is only happening on the <code>p</code> tag. Every other element will render the font at any size without issue.</p> <p>I have tried with 3 different font families. I am not using any normalize files or any other CSS.</p> <p>I attempted to create a fiddle but the web font is not pulling from Google's web service on Android Chrome:</p> <p><a href="http://jsfiddle.net/yxcec/4/" rel="noreferrer">http://jsfiddle.net/yxcec/4/</a></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