All Components

Limitations and Browser Support

Due to the specifics of their implementation, both the Drawing library and the PDF Export component share certain limitations.

General Behavior

  • The drawing of HTML elements provides no right-to-left (RTL) support.
  • The PDF export of data-visualizing (DataViz) Kendo UI widgets for jQuery, such as Charts and Gauges, is not supported. To process pages with DataViz controls, use the drawDOM configuration.
  • Internet Explorer does not support the PDF export of .svg source files.
  • The PDF export of vertically aligned elements is not fully compatible with automatic page-breaking and might lead to undesired side effects.
  • Browser zoom levels that are lower than 100% are not supported.
  • The PDF export of the Shadow DOM is not supported.
  • The PDF v.1.5 specification limits the maximum document size to 5080mm x 5080mm (200 x 200 inches). As a result, larger files might not open in some viewers.
  • The maximum file size of the exported PDF document has a system- and browser-specific limit—use a server-side solution for large documents.

Elements and Styles

  • The PDF export of <iframe> and <svg> elements is not supported.
  • The rendering of <select> elements is not precise and might lead to layout issues such as wrong padding or a missing drop-down arrow—instead of a plain <select> element, use the Kendo UI DropDownList component.
  • Of the border styles, the PDF export of solid is only supported.
  • The PDF export of border-collapse:collapse table style is not supported. To prevent double borders in the PDF output, avoid using adjacent borders for separate table cells.
  • While the box-shadow, text-shadow, and radial CSS gradients are not exported in PDF, linear is supported.
  • Elements with position: fixed are not displayed in the output and are skipped over by the algorithm.
  • Vertical texts which use the vertical-rl or vertical-lr values of the writing-mode property are not exported.

Images

Only the export of images with correct extensions is supported. For example, a PNG image with a JPG extension that is displayed on a page might not show up in the exported PDF file or might cause exceptions in the PDF reader.

Cross-Origin Resources

  • Images that are hosted on different domains are exported only if the server provides permissive Cross-Origin HTTP headers. Similarly, fonts might not be loaded across domains. Even with the proper CORS headers, Internet Explorer 9 is not able to load images or fonts from another domain and might raise a security exception. If your application supports Internet Explorer 9, make sure that you host images and fonts on the same domain as the application.
  • A <canvas> is rendered as an image only if it is not tainted—that is, only if it does not display images from another domain.

Page Breaking in Elements

  • If an element does not have textual content, it will not be split across pages. For example, a <div> element that contains text will be split. If a <div> element that does not contain text but includes a border or a background image will not be split.

    If elements that are not subject to splitting fall on a page boundary, they will be moved to the next page along with all DOM nodes that follow them. If they do not fit on a single page, they will be truncated.

    The following nodes do not support automatic page breaking:

    • <img>
    • <tr>
    • <iframe>
    • <svg>
    • <object>
    • <canvas>
    • <input>
    • <textarea>
    • <select>
    • <video>
  • Positioned elements (position: absolute) do not support automatic page breaking. Elements with the position: fixed configuration are not supported at all. They will not show up in the output and are skipped over by the algorithm. For example, the input on an A4 page, which is demonstrated in the following example, will only display the Foo and the Baz paragraphs in the output file and the positioned <div> element will appear on the first page at height 1000. Because this dimension is beyond the page boundary, the content will be clipped.

    <p>Foo</p>
    <div style="position: absolute; top: 1000px">Bar</div>
    <p>Baz</p>
  • If the algorithm moves a node to the next page and even if the space to position it on the current page might be sufficient, all DOM nodes which follow it will be moved as well.

    The following example demonstrates floating elements that acquire this behavior.

    <p>
     some text before
     <img style="float: left" ... />
     some text after
    </p>

    This element might end up in a position where the whole text fits on the current page but the image is higher and would fall on the boundary. In this case, the image and a part of the following text will move to the next page.

Supported Browsers

  • Internet Explorer 9 and later
  • Latest Chrome, Firefox, Safari, and Blink-based Opera versions

Because of browser limitations and CORS-related security restrictions, PDF export is not supported for mobile—for example, locally stored font files cannot be loaded in hybrid applications. While in specific scenarios PDF export might still work on mobile devices, it is not supported by mobile browsers and hybrid applications.

In this article