This is a migrated thread and some comments may be shown as answers.

Font size problem with HTML export inline styles

2 Answers 50 Views
WordsProcessing
This is a migrated thread and some comments may be shown as answers.
James
Top achievements
Rank 1
James asked on 01 Feb 2018, 05:22 PM

Greetings.

Imported the following HTML into the DPL.

    <style type="text/css">
        p {
            font-family: Calibri;
            font-size: 14.6666666666667px;
            margin-top: 0px;
            margin-bottom: 0px;
            line-height: 115%;
        }
 
        .TelerikNormal {
            font-family: Calibri;
            font-size: 14.6666666666667px;
            margin-top: 0px;
            margin-bottom: 0px;
        }
 
        .TelerikHeading1 {
            font-family: Cambria;
            font-size: 28px;
            font-weight: bold;
            color: #4F81BD;
            margin-top: 18.6666666666667px;
            margin-bottom: 18.6666666666667px;
        }
 
        .TelerikHeading2 {
            font-family: Cambria;
            font-size: 20px;
            font-weight: bold;
            color: #4F81BD;
            margin-top: 18.6666666666667px;
            margin-bottom: 5px;
        }
 
    </style>
<h1 class="TelerikHeading1">
    <span>Study Results</span>
</h1>
<h2 class="TelerikHeading2">Issue 1</h2>
<p>This is the issue</p>

Then we export using the following settings in order to include the HTML in an email:

HtmlExportSettings exportSettings = new HtmlExportSettings()
{
    DocumentExportLevel = DocumentExportLevel.Fragment,
    ImagesExportMode = ImagesExportMode.External,
    ImagesFolderPath = @"C:\Temp\TestImages",
    ImagesSourceBasePath = "cid:",
    StylesExportMode = StylesExportMode.Inline
};
htmlFormatProvider.ExportSettings = exportSettings;
string body = htmlFormatProvider.Export(outputDocument);

The resulting HTML replaces the <h1> and <h2> tags as expected, but it looks like only the color from the assigned classes is being used. The rest of the styles appear to come from the <p> style.

Is there a workaround for this?

2 Answers, 1 is accepted

Sort by
0
James
Top achievements
Rank 1
answered on 01 Feb 2018, 06:57 PM

Created heading1 and heading2 classes and got it to work. I think I'm good!

    <style type="text/css">
        p {
            font-family: Calibri;
            font-size: 14.6666666666667px;
            margin-top: 0px;
            margin-bottom: 0px;
            line-height: 115%;
        }
 
        .TelerikNormal {
            font-family: Calibri;
            font-size: 14.6666666666667px;
            margin-top: 0px;
            margin-bottom: 0px;
        }
 
        .heading1, .TelerikHeading1 {
            font-family: Arial;
            font-size: 28px;
            font-weight: bold;
            color: #4F81BD;
            margin-top: 18.6666666666667px;
            margin-bottom: 18.6666666666667px;
        }
 
        .heading2, .TelerikHeading2 {
            font-family: Cambria;
            font-size: 20px;
            font-weight: bold;
            color: #4F81BD;
            margin-top: 18.6666666666667px;
            margin-bottom: 5px;
        }
 
    </style>
<h1 class="TelerikHeading1 heading1">
    <span>Study Results</span>
</h1>
<h2 class="TelerikHeading2 heading2">Issue 1</h2>
<p>This is the issue</p>

 

0
Tanya
Telerik team
answered on 05 Feb 2018, 11:06 AM
Hi James,

I am happy to hear that you managed to find the solution. In the particular scenario, the default formatting of headings is lost because of the change in the tags, so you will need to explicitly apply the styling, as you already have found.

Regards,
Tanya
Progress Telerik

Tags
WordsProcessing
Asked by
James
Top achievements
Rank 1
Answers by
James
Top achievements
Rank 1
Tanya
Telerik team
Share this question
or