Textarea With Horizontal Rule Showing Up On Print

I am currently working on a website where a user can look at a mechanical request by a customer on the site. They can then print the request. I am trying to add a 'notes' section t

Solution 1:

Most folks have their browsers set to the default option "do not print backgrounds." A dark-background page can eat up your ink fast! If your "lines" are implemented leveraging "background," they won't print.

As a workaround, try creating an independent image. Set its z-index appropriately (remember to use position), and then hide it from the screen css, showing it only for the print css.

Solution 2:

This has been reported in similar situations with how the <textarea> gets rendered before printing. A solution worth looking at is to duplicate the <textarea> as a standard <div> or other element before/when calling for printing.

A resource showing an example of how to go about replacing a <textarea> using jQuery can be found here: http://www.entwicklungsgedanken.de/2011/02/07/how-to-replace-textarea-tags-with-simple-div-tag-including-it-content-for-a-printing-view/.