I am using OpenHTMLToPDF C# library to generate PDF from HTML.
Few words in my PDF generated doesn't have space in between letters. For example And Certificate.
There is no space between letters A & n, r & t
Below is my sample code and the styles I have applied to my HTML.
I had the same problem, I solved it by using a different font for my html
use this property:
font-family: Arial, Helvetica, sans-serif !important;
in your body to change the whole font, hopefully this will help you out.
Related
This is my first time using a website template which uses SCSS and thus I have no clue what to do with this.
I have the following code to set the text stying of my navbar links:
.nav-link{
font: 500 15px/120px $rob;
text-transform: uppercase;
color: #fff;
padding: 0px;
display: inline-block;
&:after{
display: none;
}
}
I have set the min/max font size to be 15px/120px. However on my website it keeps appearing as 12px. What am I doing wrong?
Inspect element shows this:
But when I check the code it shows as this:
With a bit of luck, you can find your way to the truth using Sass source maps. It seems like your template has this built-in, since you can see the file name _header.scss:17 in your inspector code. (If source maps weren't enabled it would just say the name of the compiled .css file.)
In Chrome dev tools, you can ctrl-click the property value - in this case 500 15px/120px $rob as shown in your screenshot.
This should take you to the "Sources" panel in dev tools and show the .scss file that compiles this specific value, and you can see if you have been editing the right file.
Since it's a common practice to split up Sass files into smaller files (or partials), there's a good chance your edits are being overwritten in one of the other partials in the template.
I'm trying to set a Roboto font variant in CSS - not working.
font-family: 'sans-serif-condensed'
I tried 'Roboto-Black' - not working also.
If I set the font-family to a font name that's in my /app/fonts folder - that works.
To apply font variant use either css properties like font-weight (bold, normal) and font-style (italic, normal) or provide the different font variants usually created by the authors of the fonts in separate font files.
With Roboto you have 12 different made font variants like Roboto-Bold, Roboto-THin, Roboto-Medium and others. You can use them with the file name as you mentioned in your post.
e.g.
app.css
.rb-black {
font-family: "Roboto-Black"
}
.rb-black-italic {
font-family: "Roboto-BlackItalic"
}
.rb-bold {
font-family: "Roboto-Bold"
}
.rb-medium {
font-family: "Roboto-Medium"
}
Will produce the following results:
Sample project can be found here
font-family in NativeScript supports three generic families as follows:
serif (ex. Times New Roman)
sans-serif (ex. Helvetica)
monospace (ex. Courier New)
So using sans-serif-condensed won't produce the expected results.
This question is specific to docs.typo3.org please.
I'd like to create PDFs from the documentation on docs.typo3.org using the print dialog, because it's sometimes easier to mark all the things to do before you start doing it.
So e.g. I'd like to print out the https://docs.typo3.org/typo3cms/extensions/multishop/Administrator/Typo3BackendSection/Index.html to a PDF. (Yes I know if the developer would set all the necessaryy things a PDF would be generated, but this is not what I am after here)
I'd simply like to do a Ctrl+P to create a PDF with any of the pdf-creators.
Unfortunately this works in most cases for the 'normal' text, but does not for the headings h1, h2, ....
The headings seem to be included as graphics an can not be marked/highlighted in the PDF.
I've tried already several pdf-creators, have looked into the html and .css, but can't find anything how to overcome this issue.
Any solution or suggestion appreciated.
Thanks for your effort to respond.
Cause
As far as I could figure out now, is the font-family: Share;, where Share is a Web Font as far as I understand it.
Solution
Injected a font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; and the problem is gone.
I have a font in .otf format (I've converted it to .ttf too). My source for the PDF to be generated is ImportFromUrl. When I request this URL directly from a browser, the font works with the following CSS...
#font-face {
font-family: DINPro;
src: url("http://myhost.com/css/fonts/DINPro.otf") format("opentype");
}
body{
font-family: DINPro;
}
This has no effect on the generated PDF though. How can I use this font? I've tried converting the font to Cufon but the text was blurry.
I added the following code when creating the ASPPdf object...
Doc.Fonts.LoadFromFile Server.MapPath("/") & "\css\fonts\DINPro.ttf"
Epic... it works!
I've included OpenSans-Light.ttf in source. If I added either font-weight: lighter or font-weight: 200 it is not getting applied on PDF. Always the regular font style is getting applied.
Any solution/workaround would be much appreciated.
mPDF does not support multiple weights for a font face - just normal and bold
http://www.mpdf1.com/forum/discussion/1369/open-sans-problems-with-bold-font-weight/p1
One workaround is to use .light {font-family:Open Sans Light}
Here's an example of what you get:
Another solution, which gives the same result is to use font-faces like this:
#font-face {
font-family: 'Open Sans';
src: url("font/OpenSans-Regular.ttf");
-fs-pdf-font-embed: embed;
-fs-pdf-font-encoding: Identity-H;
}
#font-face {
font-family: 'Open Sans';
src: url("font/OpenSans-Light.ttf");
font-weight:200;
-fs-pdf-font-embed: embed;
-fs-pdf-font-encoding: Identity-H;
}
.normal{font-family:Open Sans;}
.lighter{font-family:Open Sans;font-weight:200}
As said by #Lyuba Evdokimova pdf generation engine might not support all properties related to the given font.
I believe all of them works fine with web_safe fonts.
You can find more about them here.
This is not the best solution, but it's a workaround.
You may use this CSS to replace for lighter font-weight:
text-shadow: -0.06ex 0 currentColor, 0.06ex 0 currentColor!important