Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.
This is the final spam on the matter of CSS :)
I made this print style and it's useful to me when I feel like printing the question. Perhaps it deserves to be included into our CSS file:
@media print {
/* Zooming to fit A4 or legal page. Not all browsers support zoom style,
so you might have to do it manually. */
body {
zoom: 150%;
}
/* Kill the orange system message */
#system-message {
display:none !important;
}
/* Otherwise the whole page shrinks on WebKit-based browsers */
#question-header {
width: 730px !important;
}
/* Deleted -- not a bug. */ /* Otherwise the header is underlined */
/* Kill the bottom of the page */
#post-form + div, #post-form + div + script + div,
#post-form + div + script + div + script + script + script + h2
{
display: none !important;
}
}
Tested on Safari 4 only though.
I've added the part that kills the system message, but as far as I can tell, the other things don't make a difference (using chrome or firefox on linux). If I understand your comments correctly, you're saying that if you zoom out with your browser and then tell it to print, you get a different output? Am I looking for the wrong changes?
zoom: It looks like Safari is unique among browsers in that it respects the current zoom on the page when printing rather then trying to fit to page by default (it's a checkbox in Firefox).
question header: Yes, this breaks printing in Safari and Chrome, but not Firefox. I'll send you PDF if you can't reproduce
question header a: This is indeed not necessary (I had preview with mouse hovering over it and thought there's a bug).
bottom: This should kill button "Post an answer" and some text below it; this should work similarly for browsers that understand CSS selectors. I don't remember from my mind, but this should work for all of the major browsers. Look closely to the bottom :)
Browsers:
I've added your changes. I can't reproduce in Chrome on linux, and the stuff that's supposed to kill the bottom of the page doesn't do anything for me. The form tag was already display:none so the "post your answer" form didn't appear. What do the plus signs mean?
Things don't change for you because
/* Override some print options in stack-exchange.css */
@media print {
...
#question-header {width: 730px;} <----- Here should be !important; it's overridden otherwise
/* Kill the bottom of the page */
#post-form div, #post-form div script div, #post-form div script div script script script h2
{ ^^^^^^^^^^^^^^^^ Here should be +, this will make it select things near #post-form, rather then inside
display: none !important;
}
}
Actually, I took a look into the bottom of the page again. It can look different depending on the contents of the page you're on. This should be much better (sorry for the confusion):
#show-editor-button /* Kill "Add another answer" button */ ,
#answers > h2 /* Kill the text "Browse other questions tagged ..." */
{
display: none !important;
}
The > character after #answers is crucial: it's child selector; without it the line would also kill all headers of level 2 inside the questions themselves.
Weird. I don't know what happened to those plus signs. I copied and pasted (and removed some of the !important s that I didn't think were necessary). In any case #answers > h2 is clearly better. I don't see why the !important in the question-header is necessary ... it's the last file loaded, and question-header doesn't have an !important in any of the other css files (as far as I could see). But I've added it anyway.
I don't see why the !important in the question-header is necessary ...
There could be another explanation: for a while today I saw the old css file which didn't contain anything mentioned here in @media print (improper caching?); that could make me think the problem was in missing !important. It should be unnecessary indeed.
Now all of my complaints are solved :)
1 to 8 of 8