CSS Druckvorschau
0 
alfie
0 
Auge
0 0 0 Auge
0 0 Doppelposting
Felix Riesterer
CSS Druckvorschau
Hallo,
habe eine CSS für den Bildschirm und für den Drucker erstellt.
Dann habe ich das Querformat für den Drucker eingestellt. Bei Firefox funktioniert alles tadellos. Nur der IE6 nimmt das Querformat nicht und die Spalte Artikelbezeichnung ist etwas abgeschnitten.
Hier der Quelltext:
Viele Dank schon im Voraus.
by Christian
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="de">
<head>
<title>Die CampingKiste</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<style type="text/css" media"screen">
body{
color:black;
background:#f4f9f2;
padding:0;
margin:0;
font:13px verdana, sans-serif;
text-align:justify;}
#head{
width:100%;
position:absolute;top:0;left:0;
padding:40px 0 2px 0;
margin:0;
color:white;
background:transparent;
border-bottom:1px solid black;}
#head h1{
padding:5px;
margin:0;
color:white;
background:#B7B1F5;
font:bold 18px verdana, sans-serif;
border-top:1px solid black;
border-bottom:1px solid black;}
#menu{
float:right;
width:110px;
background:#B7B1F5;
padding:0 5px 50px 5px;
margin:90px 10px 0 0;
border:1px solid black;}
#menu ul{
padding:0;
margin:0 0 20px 0;
list-style:none;
text-align:right;}
#menu li{
padding:0 0 2px 0;}
#menu a{
color:white;
background:#6254E4;
display:block;
width:100px;
padding:2px;
border:1px solid black;
font:bold 12px verdana, sans-serif;
text-decoration:none;
text-align:center;}
#menu a:hover{color:#008000;background:#e3eedd;}
#menu p{
font:bold 12px verdana, sans-serif;
text-align:center;
padding:5px;
margin:0;}
#content{
color:black;
padding:110px 30px 30px 30px;
margin:0 160px 0 20px;
background:#e3eedd;
border-left:1px solid black;
border-right:1px solid black;}
#content h2{
margin:0 0 10px 0;
padding:2px 0 2px 5px;
font:bold 18px verdana, sans-serif;
#content h3{
margin:25px 0 10px 0;
padding:2px 0 2px 5px;
font:bold 14px verdana, sans-serif;
border-left:8px solid #9bc88c;
border-bottom:1px solid #9bc88c;}
#content h4{
margin:25px 0 10px 0;
padding:2px 0 2px 5px;
font:bold 12px verdana, sans-serif;
border-left:6px solid #9bc88c;
border-bottom:1px solid #9bc88c;}
#foot{
clear:right;
color:white;
background:#9bc88c;
padding:5px 30px 5px 0;
margin:0;
font:bold 12px verdana, sans-serif;
text-align:right;
border-top:2px solid black}
#foot p{margin:0;padding:0;}
}
</style>
<style type="text/css" media="print">
@page { size: landscape;}
#menu {display:none;}
#head {display:none;}
#foot {display:none;}
#content{
color:black;
padding:110px 30px 30px 30px;
margin:0 160px 0 20px;
background:#e3eedd;
border: none;
width:100%;}
</style>
</head>
<body>
<div id="head">
<h1>Die CampingKiste</h1>
</div>
<div id="menu">
<p>Menu:</p>
<ul>
<li><a href="index.php?seite=versandliste.php">Versandliste</a></li>
<li><a href="index.php?seite=versanddatum.php">Versanddatum</a></li>
</ul>
</div>
<div id="content">
<h2>Versandliste</h2>
<table border='1'>
<td><b>Renr.</b></td><td><b>Vorname</b></td><td><b>Nachname</b></td><td><b>Strasse</b></td>
<td><b>PLZ</b></td><td><b>Ort</b></td><td><b>Artikelnr.</b></td><td><b>Menge</b></td><td><b>Artikelbezeichnung</b></td>
<tr>
<td>240002</td><td>Franz-Josef</td><td>Rasche</td><td>Schmerlecker Dorf 25</td><td>59597</td><td>Erwitte</td><td>N22.0111.00</td><td>1.000</td><td>230 Volt Keramik Heizung</td></tr>
<tr>
<td>240003</td><td>Alfred</td><td>Kandziora</td><td>Südallee 2</td><td>49716</td><td>Meppen</td><td>F136102</td><td>1.000</td><td>Alu-Stützbock-Set</td></tr>
<tr>
<td>240004</td><td>Sönke</td><td>Kahrs</td><td>huttfletherweg 4</td><td>21720</td><td>steinkirchen</td><td>N22.4387.00</td><td>1.000</td><td>12 V Keramik-Heizlüfter</td></tr>
<tr>
<td>240005</td><td>Kathrin</td><td>Dietzsch</td><td>Kranichweg 12</td><td>18356</td><td>Barth</td><td>N22.4387.00</td><td>1.000</td><td>12 V Keramik-Heizlüfter</td></tr>
<tr>
<td>240006</td><td>Matthias Trunk</td><td>PROFICOM GmbH / Hr. Trunk</td><td>Zeppelinstraße 43a</td><td>97074</td><td>Würzburg</td><td>N22.0111.00</td><td>1.000</td><td>230 Volt Keramik Heizung</td></tr>
</table>
</div>
</body>
</html>
-
Hallo!
<style type="text/css" media="print">
@page { size: landscape;}
Du kennst http://de.selfhtml.org/css/eigenschaften/printlayouts.htm#page?
Der IE spielt da leider nicht mit.
mfg Alfie
-
Hallo
habe eine CSS für den Bildschirm und für den Drucker erstellt.
Dann habe ich das Querformat für den Drucker eingestellt. Bei Firefox funktioniert alles tadellos. Nur der IE6 nimmt das Querformat nicht und die Spalte Artikelbezeichnung ist etwas abgeschnitten.Hier der Quelltext:
<style type="text/css" media="print">
@page { size: landscape;}
...
</style>SELFHTML führt aus, dass diese Angabe nur vom Opera ab Version 5.12 interpretiert wird. Wenn der FF dies auch kann, wundert es mich, dass dies noch niemandem in der Redaktion aufgefallen sein soll.
Tschö, Auge
--
Die Musik drückt aus, was nicht gesagt werden kann und worüber es unmöglich ist zu schweigen.
(Victor Hugo)
Veranstaltungsdatenbank Vdb 0.1-
Hi,
SELFHTML führt aus, dass diese Angabe nur vom Opera ab Version 5.12 interpretiert wird. Wenn der FF dies auch kann, wundert es mich, dass dies noch niemandem in der Redaktion aufgefallen sein soll.
Wann ist Dein Firefox erschienen? Und wann wurde SELFHTML 8.1.1 veröffentlicht? Beta-Versionen haben wir nicht berücksichtigt.
freundliche Grüße
Ingo-
Wann ist Dein Firefox erschienen? Und wann wurde SELFHTML 8.1.1 veröffentlicht? Beta-Versionen haben wir nicht berücksichtigt.
Das ist der Firefox 1.0.6
-
Hi,
Das ist der Firefox 1.0.6
und in dem funktioniert landscape schon?
Mein 1.0.4 macht das noch nicht.freundliche Grüße
Ingo
-
-
Hallo
SELFHTML führt aus, dass diese Angabe nur vom Opera ab Version 5.12 interpretiert wird. Wenn der FF dies auch kann, wundert es mich, dass dies noch niemandem in der Redaktion aufgefallen sein soll.
Wann ist Dein Firefox erschienen? Und wann wurde SELFHTML 8.1.1 veröffentlicht? Beta-Versionen haben wir nicht berücksichtigt.
Ich bezog mich auf die Ausführungen von Christian, der schrieb, dass mit FF alles "tadellos" funktionieren würde.
Tschö, Auge
--
Die Musik drückt aus, was nicht gesagt werden kann und worüber es unmöglich ist zu schweigen.
(Victor Hugo)
Veranstaltungsdatenbank Vdb 0.1
-
-
-
Hallo Christian,
habe eine CSS für den Bildschirm und für den Drucker erstellt.
Dann habe ich das Querformat für den Drucker eingestellt. Bei Firefox funktioniert alles tadellos.Tatsächlich? Ich habe das Beispiel soeben mit Firefox 1.5 negativ getestet.
Grüße
Roland -
Lieber Christian,
warum bleibst Du nicht in Deinem Thread?
Liebe Grüße aus Ellwangen,
Felix Riesterer.