question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

doesn't support font-family property with multiple value

See original GitHub issue

Using 0.5.0-beta4, thanks so much for this great module!

The problem I am having is, say I have a class .class { font-family: "somefont", "Arial" } where “somefont” doesn’t apply, the end result is elements that are .class would be rendered using Arial in the page, but in the canvas the default font is applied instead.

Any idea?

Issue Analytics

  • State:closed
  • Created 8 years ago
  • Comments:8 (1 by maintainers)

github_iconTop GitHub Comments

10reactions
eZ0commented, Feb 18, 2016

I found the reason: parent of canvas has to have explicit font declaration like so: .container { font-family: Roboto, "Helvetica Neue", sans-serif; }

2reactions
ruslankonevcommented, Oct 9, 2018

not work, I got the same error image

rendered by

html2canvas(this.$refs.iFr, { useCORS: true }).then(canvas => {
        console.log(canvas)

        document.body.appendChild(canvas)

        canvas.toBlob(function(blob) {
          saveAs(blob, 'Dashboard.png')
        })
      })

Custom loaded fonts from server (not CORS) is not render. Used font — based64 css file as font-face to Liberation Serif

Read more comments on GitHub >

github_iconTop Results From Across the Web

Multiple fonts in Font-Family property? - Stack Overflow
Yes. The font-family property can hold several font names as a "fallback" system. If the browser does not support the first font, ...
Read more >
font-family - CSS: Cascading Style Sheets - MDN Web Docs
The font-family CSS property specifies a prioritized list of one or more font family names and/or generic family names for the selected element....
Read more >
font-family - CSS-Tricks
The font-family property defines the font that is applied to the selected element. The font that is selected is not a single font...
Read more >
CSS font-family property - W3Schools
The font-family property can hold several font names as a "fallback" system. If the browser does not support the first font, it tries...
Read more >
CSS Font Family List - TutorialBrain
Browsers do not support all the fonts, so you need to use multiple fonts to be on safer side. CSS font-family defines the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found