Why Websites Print Incorrectly: Six Common CSS Print Problems and Debugging Tips

A developer describes how a web page that looks correct on screen can break when printed, with tables splitting across pages, backgrounds disappearing, and edges being cut off. The article explains that browsers optimize for screens, so printed documents need dedicated print styles that hide interface elements and remove shadows and fixed widths. It highlights mismatches between A4 and US Letter paper sizes and shows how @page rules can set margins and size, while noting that printer settings still have the final say. It also points out that browser scaling options can shrink output, recommends printing a reference test sheet to tell scaling issues apart from CSS problems, and covers color reproduction, where the print-color-adjust property may be needed to keep backgrounds visible.