title: How to fix/work around QtWebKit's incorrect font fallback behavior?
body: <p>I have a website in which some pages have user-generated content. I use phantomjs (based on QtWebKit) to take screenshots of the pages, so they must render perfectly in QtWebKit.</p>
  
  <p>The problem starts when the content is not in English. Then, popular browsers (such as Chrome and Firefox) fall back to the next font in the CSS font-family, up to the default font. However, in my tests, QtWebKit seems to exhibit different behavior: it incorrectly picks a font that's unable to render the content.</p>
  
  <p>Consider this example file, "fonts.html":</p>
  
  <pre><code>calibri, arial:
  &lt;div style="font-family: calibri, arial; font-size: 36px;"&gt;
  ฝ่ายอีเว้นท์พร้อมแล้วกับงานปาร์ตี้ที่สนุกที่สุดในกทม
  &lt;/div&gt;
  
  calibri:
  &lt;div style="font-family: calibri; font-size: 36px;"&gt;
  ฝ่ายอีเว้นท์พร้อมแล้วกับงานปาร์ตี้ที่สนุกที่สุดในกทม
  &lt;/div&gt;
  
  arial:
  &lt;div style="font-family: arial; font-size: 36px;"&gt;
  ฝ่ายอีเว้นท์พร้อมแล้วกับงานปาร์ตี้ที่สนุกที่สุดในกทม
  &lt;/div&gt;
  
  default:
  &lt;div style="font-size: 36px;"&gt;
  ฝ่ายอีเว้นท์พร้อมแล้วกับงานปาร์ตี้ที่สนุกที่สุดในกทม
  &lt;/div&gt;
  </code></pre>
  
  <p>Here's how it renders in Chrome and in Arora (a QtWebKit-based browser, that gives identical results to my phantomjs script):</p>
  
  <p><img src="https://i.stack.imgur.com/MDhPD.png" alt="Font fallback problem in Chrome vs QtWebKit"></p>
  
  <p>What I'd like to have is for the text to be rendered in Calibri and, if unsuitable for some characters, fall back to Arial.</p>
  
  <p>I'll accept either a solution that tells me how to configure QtWebKit to allow this (I couldn't find anything on the web), or how to change my HTML/CSS to "support QtWebKit".</p>