CODEWITHSUNDEEP
javascripthtmlcss
user237865
user237865

Reputation: 1250

print webpage in two columns

How to print a webpage in two columns or one column as per the user input/choice.

And when a take a print out I'm getting the website url on the top left side, How can we stop printing this?

Regards

Upvotes: 3

Views: 3035

Answers (5)

René Nyffenegger
René Nyffenegger

Reputation: 40533

With mozilla, you can use the -moz-column-count style:

<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'>
<html>
<head>
  <title>Two columns</title>
  <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
</head>
<body>

  <div style='-moz-column-count:2'>
     one<p>
     two<p>
     three<p>
     four<p>
     five<p>
     six
  </div>

</body>
</html>

It doesn't work with IE, however, and I don't think there's something equivalent for IE, either.

As for the printing of the URL, others have already pointed out that you have no control over it. The user can (and I usually do) in Firefox in the dialog File -> Page Setup -> Margins & Header/Footer: set Header and footers to blank.

Upvotes: 2

jeroen
jeroen

Reputation: 91742

You can add a style-sheet specific for printing and in theory that would allow you to print your content in 2 columns or 1, depending on user choice and how well your html is organized.

The address at the top of the print-out comes from the visitor's browser and I doubt you can turn it off at it is a setting that only the visitor has control over.

Upvotes: 1

Quentin
Quentin

Reputation: 943999

How to print a webpage in two columns or one column as per the user input/choice.

You could provide an alternative stylesheet using @media rule to provide a different layout that is only applied to print media … but I suspect this is better off left to the user's printer settings.

And when a take a print out I'm getting the website url on the top left side, How can we stop printing this?

This is a browser preference. Authors can't remove it.

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114417

The URL appearing on the page is a browser setting and cannot be controlled by script.

Two print in two columns, make sure your HTML uses a print stylesheet and make sure your HTML can easily be reformatted in two columns using floats.

Upvotes: 0

Richard JP Le Guen
Richard JP Le Guen

Reputation: 28753

When specifying a <link> (such as to a CSS stylesheet) you can specify a media attribute so the CSS will only be used for print or screen. (or braille!) The CSS in this file can then re-style your site into columns as you see fit.

<link type="text/css" rel="stylesheet" href="print.css" />

You could specify two print CSS files like this, and - using JavaScript - prompt the user for which CSS file to use when they print, toggling the disabled member of the <link>:

var printCSS = document.getElementsByTagName("link")[n];
printCSS.disabled = true;
printCSS.disabled = false;

Upvotes: 2

Related Questions