Font size problem with HTML export inline styles

[James]

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?

[James]

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>

[Tanya]

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