Titan CMS online support, find help and get answers

Browser Bug - Printing Pages With Floated (CSS) elements

  • Published: October 03, 2008
  • |
  • Updated: April 01, 2013
  • |
  • Version: 5

This article explains a common bug present in most browsers, including IE (Internet Explorer) and Firefox.  This bug pertains to printing webpages with floated (CSS) HTML elements.


Titan CMS has built-in functionality for generating printer-friendly versions of pages on your website.  You can specify a “page tools” section in your page layouts, which can generate a link to a printer-friendly version of that page.  You can also append a “PrintPage=yes” query string parameter to your page URL to manually generate this page (E.G. www.Titan CMS.com/Features.htm?PrintPage=yes).

When creating printer-friendly pages, it is important to be aware of a bug in most major browsers that affects HTML elements that are using floating CSS styles.


Most websites these days, including Titan CMS websites, utilize CSS very heavily for formatting and generating the overall look & feel of the site.  A commonly used feature of CSS is the ability to “float” elements a particular direction of the page.  This, however, can cause problems when printing the page. 

A bug exists (observed in IE6, IE7, and FireFox) that causes floated elements to get cut off when they are printed.  The problem occurs when the floated element is so long that a page break should divide it in half.  Instead of placing a page break successfully, the browser simply prints the first half of the element, and cuts off the rest.  It has been observed that the printer will sometimes stop printing at that point, or simply print out multiple blank pages where the rest of the content should be.

As a workaround to this bug, you should leverage the ability to specify different media types in your CSS files.  These media types specify how a document is to be presented on different media – on the browser screen (default), on paper (printed), etc.  A special CSS should be specified for the print media, which removes any float declarations and formats the page an alternative way.


How to Specify Media Types

Mozilla Bug Report Indicating “float bug”

Guide to Printing Web documents