Take the 2-minute tour ×
Super User is a question and answer site for computer enthusiasts and power users. It's 100% free, no registration required.

I tried all possible standard options and I think that it will take some hack to do it the right way.

Pressing PrtSc, pasting to Paint and cutting off the margins would work, but I would like to get a solution for multiple pages. Repeating PrtSc multiple times is out of the question.

Each time I'm trying to print a page, for instance this Twitter page, I get something like this no matter what OS or browser I use. How can I get it to preserve the style while doing this?

share|improve this question

3 Answers 3

You could do a screenshot (using something like Aviary for Chrome) and print it.

enter image description here

share|improve this answer
    
I'm sorry, but all screenshot plugins that I tried (for FF/Chrome, incl. Aviary) seem to be of low quality and can handle only smaller web pages. None was capable of printing this link for example: omikheev.spb.ru/Twitter%20_%20Search%20-%20@MedvedevRussia.htm, so if you know some better ones - I'll be glad to mark this question back to answered –  Oleg Mikheev Dec 5 '11 at 11:09
    
You are pushing the envelope here –  molgar Dec 5 '11 at 11:41
    
no! browsers have no problem printing that out as PDF at all, I'm just looking for a better formatting –  Oleg Mikheev Dec 5 '11 at 11:56

Another option would be a 'PDF printer' creation program, personally i use Bullzip for many online banking pages which do not otherwise print correctly. Just 'print' them to the PDF creator then actually print them from there! :)

share|improve this answer
    
have you tried to PDF print a twitter page? it looks ugly –  Oleg Mikheev Dec 5 '11 at 11:03
    
#don't #think #twitter #was #designed #with #printing #in #mind –  HaydnWVN Dec 5 '11 at 11:20
    
it's not just Twitter, as I mentioned in the question... –  Oleg Mikheev Dec 5 '11 at 11:57
    
If you want it exactly as seen on screen then you need to take the formatting into your own hands rather than rely on whatever webpage layout each individual site happens to use... Simple answer - alt+Print Screen –  HaydnWVN Dec 5 '11 at 12:20

Ok, I found out how to do that!

Twitter style gets broken when you print due to the fact that HTML stylesheets can have media types assigned to them, thus providing different styles for different media (printer, screen etc).

So, I saved Twitter page that I need to print to an HTML file (choosing Web Page, complete) and looked into HTML sources. I saw that the main CSS was having media="screen" - which meant that this CSS had no effect for printing.

I removed just this single media="screen" text from the HTML and saved it.

Now Twitter page gets printed the right way!

This info will be also useful to other people trying to print or take a screenshot of a large huge web pages.

When your screenshot taking plugin/add-on fails due to the web page size (in case of Firefox it results in this exception in Error console:

Error: uncaught exception: [Exception... "Component returned failure code:
0x8007000e (NS_ERROR_OUT_OF_MEMORY) [nsIDOMHTMLCanvasElement.getContext]"  
nsresult: "0x8007000e (NS_ERROR_OUT_OF_MEMORY)"  location: "JS frame :: 
chrome://uploadscreenshot/content/uploadscreenshot.js :: <TOP_LEVEL> :: 
line 211"  data: no]

) you printing to a PDF printer and this style editing method will help you!

share|improve this answer
    
This is merely a work-around, why not save an image and print that image? –  Tom Wijsman Dec 5 '11 at 13:22
    
if it's a single web page then certainly saving an image would work, but when it is a huge page (1Mb HTML) - saving an image becomes impossible.... just a thought - 1Mb HTML should not be considered huge these days –  Oleg Mikheev Dec 5 '11 at 13:25
    
There is no relationship between the size of a webpage and the size of an image, consider 1Mb HTML that just renders a white page. Even if it's a page full of stuff, it'll generate a big image but it won't be impossible. If the page can be drawn to your screen, it can also be saved to an image file... –  Tom Wijsman Dec 5 '11 at 13:29
    
I never said that there was a relationship between the size of a webpage and the size of an image. It's just impossible to generate an image if the web page is very long due to the fact that browsers fail to work with big canvases, e.g. Chrome fails if canvas height is greater than 32767 bugzilla.mozilla.org/show_bug.cgi?id=649924 –  Oleg Mikheev Dec 5 '11 at 14:34
    
The bug you refer to is marked as RESOLVED / FIXED and the new implementation is not limited in size... –  Tom Wijsman Dec 5 '11 at 14:37

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.