I am using the jsPDF client-side wise (html2canvas 1.4.1 + jspdf.debug.js 1.5.3).
pdf.fromHTML(document.getElementById('doc-content').innerHTML) is working but none of the associated CSS code for 'doc-content' and its children got used and hence its with 0 CSS and lost all formatting.
How do I get jsPDF to format with the CSS ?
Related
My goal: To style a link, that comes from a sanitized text, with a css variable. Im using a vue framework and want to use a computed style(or similar) to style it. The color of the link comes from an api.
My issue: Since the text is sanitized, no inline style will come through. I can still access the link like this:
.sub-link-style >>> a {
color: var(--color);
}
But I can't use the variable because I cannot add inline stlye.
My question: Is there a way to add a custom value(for example from vue) to a css variable without inline style?
The solution to this issue became using the sanitizers custom handler to create an exception for the attribute i needed specifically.
However, it only left me with a new problem. When the text gets into the code the computed variables are already resolved. Given up on it for now. Perhaps I'll look more at it later.
I am running into multiple warnings related to an inline style background image. Using React-static I had no issues but now with Gatsby I am getting this error:
warning Unexpected string concatenation of literals
If I only wanted to use an inline style how would I go about coding this? Any suggestion helps.
Right now I am importing my background image and using an inline style. I would rather import the image and use an inline style instead of creating multiple css styles.
Code:
import Background from '../img/background.gif';
<div id="hero" className="header-banner" style={{background: 'url(' + `${Background}` + ')'}}></div>
It looks like you've got it figured out in the comments, this is just a FYI: the message you're seeing is from eslint, specifically this rule.
This rule aims to flag the concatenation of 2 literals when they could be combined into a single literal. Literals can be strings or template literals.
So your code is valid, it's either Gatsby's default eslint setting or your own setting being picky about it. If you don't care for the rule, you can remove it by setting up your own eslint setting.
Trying to design an HTML mail but when tested in Yahoo I saw that it removes every box-sizing style from HTML.
Is there any way to get around that?
I am using a Covalent Template for the first time for my first Angular application. I downloaded the Dashboard template from https://stackblitz.com/edit/covalent-dashboard-ynyp1w?file=main.ts and tried to customize it, when I saw this error:
The placeholder is mispositioned and the letters are cropped at bottom;
One of the DIVs is with wrong height, so an ugly scrollbar is visible at right.
I tried to look into the compiled HTML and CSS, and at the source-code, but no success on how to change what is wrong. It may be in CSS or maybe in the template property of the input-search component's decorator.
I am trying to find what is overriding my CSS element using chromes element selector but am unable too.
This answer seems outdated I can't find how to access "computed styles":
Chrome Developer Tools: How to find out what is overriding a CSS rule?
I don't know why this color is overridden with gray:
chrome
How can I find whats doing it with google chrome?
If you look at the image, it will tell you that the property is changed in the element.style.
In other words, the change is not applied using a selector such as class or id, but rather to the element itself.
This can be done in two ways, as far as I am aware.
1) In HTML, writing the properties directly within the element:
<div style="color:gray;"></div>
2) In Jquery, referencing the specific object (for example, using the id property) and then using the css property:
$('#divname').css({
color:gray;
});
With regard to finding what is causing the issue:
1) Finding out if the change has been made in HTML should be fairly straightforward, as you would just need to have a look at the HTML file.
2) If the change has been made through Jquery, things get a little more complicated: a ghetto method would be to search your script files for the "gray" string. Don't forget that scripts can also be embedded into HTML, however, looking for the property the HTML file would be a good way to proceed :)