Overlapping text when printing

HTML & CSS
1

I’m having a problem where some of my text is overlapping other text when I print. I am new to the concept of a “Print” stylesheet, so I might be making some rookie errors.

Any thoughts on why text is overlapping when I “Print Preview”?

Thanks.

2

ooops. sorry: URL —> usainc.com/news

3

Hello!
I tested your site with Firefox 3, there is no problem with overlapping. In Internet Explorer 7 there is an overlapping in the first article with the footer.
I did not study your css. If the problem shows only in IE you could try to give the site a special print-css for IE with a conditional comment.
There you could try to solve the problem with some extra spacing between the article and the footer.

Susanne

4

Thanks Susanne. I should have specified IE. The problem is that this is a blog based NEWS section, so it will be updated often, and from Wordpress. So I’m concerned that the one-off fix to the IE page might be void when the next article is published.

Is there any reason the lines would be overlapping? Is there a reason that lines overlap? And is this correctable in CSS, other than forcing the offending div to have a lower position?

Thanks.

5

Hi
Did you solve your problem? Otherwise, just try it out to give the extra print-css for ie some space for the bottom of the article. In CSS things are often a game of try and error, worth than now it can’t come :wink: - and wait for the next article.

To see if the extra-print-css for ie is functions in general, give a extra-format to the text, e.g. bold text or another font-family. When you see that format in print-preview (only in ie), you can remove that extra format again.

Playing with CSS often needs time - and patience. Always try out one change at a time (comment out what you don’t need at the moment)!

Good luck!
Susanne

6

Have a look at:
http://code.google.com/p/hartija/

7

The print.css for - Hartija is pretty solid.

8

Sue,

I do understand what you’re suggesting. The thing is, the problem only occurs in one instance, but the tag being moderated is repeated. The blog automatically builds the code, so I can’t make one specific article format, or tagged differently.

I tried Hartija, and it did work beautifully as described, but it was a little too unformatted for my needs.

Basically, the print css is working great, in both IE and Firefox, with the exception of the very first instance of the metadata (css = .post_metadata). All other instances of the class are formatting and spacing as expected.

I appreciate all of the input.

-Gabe