• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

CSS und drucken - Eine Katastrophe

Status
Für weitere Antworten geschlossen.

Deep-Sea

Neues Mitglied
Hallöchen, nachdem ich nun seit fast zwei Tagen versuchen mein Problem zu lösen und auch im Netz nichts für mich gefunden habe, hoffe ich, dass ihr mir helfen könnt. :grin:

Es geht um folgendes: Ich erzeuge mit einer selbst programmierten Software eine HTML-Datei, in der sich eine Tabelle befindet.
Da diese sehr breit sein kann und Browser wie der IE und Firefox dann einfach die rechte Seite beim drucken verwerfen, habe ich zuerst pro Spalte eine eigene Tabelle genommen. Um diese, sofern möglich, nebeneinander dar zu stellen, habe ich für den IE <= 6 "display: inline;" und für IE ab 7 und FF "float: left;" genutzt.

Beim Anzeigen sieht alles wunderbar aus - genau wie ich es wollte. Aber wehe man will drucken, der IE 6 bekommt das ja noch ganz gut hin, aber der 7er und FF - eine Katastrophe. Da werden Tabellen abgeschnitten und verschoben, etc. :-(
Anbei: Der IE 6 mit "float: left;" druckt immer nur eine Seite, egal wie viele Tabellen und Texte er drucken müsste.

Danach habe ich es noch einmal mit DIV-Containern versucht - aber "display: inline;" sorgt sowohl beim IE 6 als auch bei FF für totalen Müll (auch beim Anzeigen) und "float: left;" sorgt beim IE 6 für das oben genannte Problem und bei FF wieder zu unschönen ausdrucken.


Sry für den langen Text, ich hoffe jemand hat eine Lösung oder eine Idee für mich, danke :lol:
 
Mit welcher Software erstellst Du deine HTML-Datei?
"mit einer selbst programmierten Software" :D kannst du nicht kennen, ist aber eig. auch net so wichtig.


Wie sieht dein HTML-Code aus?
Noch "gar nicht", da ich ja erst einmal versuche es überhaupt hin zu bekommen und dann es dann funktionsfähig in die Software einbaue.

Mein Versuch mit den Tabellen - funktioniert nicht beim Druck über IE 7 und FF - zum Testen müsst ihr die table einfach einige (so das es bei der Druckvorschau eben nicht mehr auf eine Seite passt) male vervielfältigen :idea:
Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Tabelle</title>
<style type="text/css">
<!--
table[class] { /* Attribut-Selektor: Nicht IE <= 6 */
    float: left;
}
* html table { /* Star-HTML-Hack: Nur IE <= 6 */
    display: inline;
}
table {
    margin-right: -1px;
    margin-bottom: 50px;
    border-collapse: collapse;
    vertical-align: text-top;
    border: 1px solid black;
}
thead {
    display: table-header-group;
    background-color: #FBF9A2;
    font-weight: bold;
}
td {
    white-space: nowrap;
    padding-left: 10px;
    padding-right: 10px;
    border-bottom: 1px dotted gray;
}
thead tr td {
    border: 1px solid black;
}
-->
</style>
</head>
<body>

<table border="0" cellspacing="0" cellpadding="0" class="colTable">
  <thead><tr><td>Spaltenname</td></tr></thead>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
  <tr><td>Daten zum testen</td></tr>
</table>

</body>
</html>
 
lager mal deinen CSS Code aus und binde ihn so in deine Seite ein:
Code:
<head>
<link rel="stylesheet" href="deine.css" media="screen" />
<link rel="stylesheet" href="deine.css" media="print" />
</head>
 
lager mal deinen CSS Code aus und binde ihn so in deine Seite ein:
Code:
<head>
<link rel="stylesheet" href="deine.css" media="screen" />
<link rel="stylesheet" href="deine.css" media="print" />
</head>

Kann ich machen, aber deswegen würde sich doch nichts ändern?! Wäre ja für den Ausdruck auch das gleiche CSS-Style wie beim Anzeigen :???:
 
ja, aber wenn du den Style normal einbindest, benutzen viele Browser wie z.B. IE 7 und FF gar kein Stylesheet beim drucken (ist zumindest bei mir so)
 
ja, aber wenn du den Style normal einbindest, benutzen viele Browser wie z.B. IE 7 und FF gar kein Stylesheet beim drucken (ist zumindest bei mir so)
Ist mir noch nicht aufgefallen - hab's aber trotzdem mal versucht, leider Fehlanzeige.
Also die Stylesheets beachten die Browser schon, aber bei manchen Tabellen eben werden Zeile verworfen etc. :shock:
 
Bei FF habe ich etwas heraus bekommen:

Wenn ich "margin-bottom" von 50px auf 25px senke, fehlen ca. nur noch die Hälfte der Zeilen, bei 0px eine.
Wenn ich jetzt noch "border-bottom" von 1px auf 0px senke, fehlt nichts mehr, setze ich ihn auf 2px hoch fehlen zwei Zeilen :shock:
Ist doch total krank, was haben margin und border damit zu tun? Und warum macht FF es nur bei manchen Tabellen obwohl ja alle gleich sind?! :-(


(Memo an mich selbst: Kein HTML mehr in eigener Software ~.~)
 
Hallo Deep-Sea!
Entwerfe mal ein print-stylesheet mit möglichst wenig style-angaben (fange mit keiner an) und versuche deine Datei zu drucken.. Da dürfte eigentlich nichts abgeschnitten werden..
 
Hallo Deep-Sea!
Entwerfe mal ein print-stylesheet mit möglichst wenig style-angaben (fange mit keiner an) und versuche deine Datei zu drucken.. Da dürfte eigentlich nichts abgeschnitten werden..
Mit etwas Troubleshooting komm ich schon ganz gut klar :D
Aber das Problem ist, dass er ohne Stylesheets zwar prinzipiell alles richtig drucken würde, aber wie ja schon im ersten Post beschrieben, würden die Browser beim drucken den rechten Rand einfach kommentarlos abschneiden, wenn die Tabelle zu breit ist. Und das Problem wollte ich mit dieser Methode umgehen.
Ich habe ja schon viel versucht, aber nichts klappt bei allen :???: Darum hoffte ich ja, dass einer von euch 'ne gute Lösung für mich hätte :roll: ...
 
mir fällt da nur noch eine Möglichkeit ein, und die ist nicht schön!

du startest das drucken über einen link, der eine javascript funktion aufruft, diese verändert die größen so, das alles gedruckt wird, startet das drucken, und macht die größenänderung rückgängig.

Code:
function drucken {
document.getElementById('test').style.width = 200;
window.print()
document.getElementById('test').style.width = 800;
}
 
mir fällt da nur noch eine Möglichkeit ein, und die ist nicht schön!

du startest das drucken über einen link, der eine javascript funktion aufruft, diese verändert die größen so, das alles gedruckt wird, startet das drucken, und macht die größenänderung rückgängig.

Code:
function drucken {
document.getElementById('test').style.width = 200;
window.print()
document.getElementById('test').style.width = 800;
}
Von wem soll ich die Größe ändern? Von der Tabelle? Das würde nichts bringen, denn irgendwann könnte er die Spalten auch nicht mehr kleiner machen, und bei einer höheren Anzahl von Spalten führt das auch dazu das der rechte Rand nicht gedruckt wird :???:
 
hm dann gib uns doch einfach mal die Datei und wir können selber mal bissel rumfummeln, ob wirs hinbekommen, nur Theorie macht müde..
 
und wo liegt jetzt das Problem? Dann bricht er die Tabelle , wenn das Seitenende erreicht ist um..
Ja, das soll er ja auch. Aber beim Drucken werden Tabellen verschoben (was nur doof aussieht, sonst aber nicht schlimm ist) und es werde einfach Zeilen weggelassen :!: - scheinbar willkürlich - sowohl beim IE 7 als auch bei FF ...
 
Ich hab deine teabelle jetzt 7mal dulpliziert.. wenn ich im ff 2.0 auf Druckvorschau klicke bricht er nach 4 Zeilen um und nimmt die nächsten 3 in die nchste zeile.. Wenn dein problem nun ist, dass du alle 7 in eine Zeile haben willst musste entweder Schriftgröße ändern oder das Ganze auf nem größeren papier (A3) drucken..
 
Ich hab deine teabelle jetzt 7mal dulpliziert.. wenn ich im ff 2.0 auf Druckvorschau klicke bricht er nach 4 Zeilen um und nimmt die nächsten 3 in die nchste zeile.. Wenn dein problem nun ist, dass du alle 7 in eine Zeile haben willst musste entweder Schriftgröße ändern oder das Ganze auf nem größeren papier (A3) drucken..
Nein, ich habe extra diesen Umstand gemacht, damit der Browser sie nicht in eine Zeile setzt. Du musst die Tabelle öfter duplizieren, 20-30 mal, so das er mehrere Seiten zum ausdrucken braucht, dann werden bei einer Tabelle sicherlich auch die hälfte der Zeilen fehlen ...
 
okay stimmt, da kommt der Firefox wol durcheinander, aber warum nimmst du nicht einfach eine tabelle, der du mehrere tds und trs zuweist.. Habs im FF und IE getestet und beide kommen damit super klar.. nimm einfach die Style-Sachen raus und mach mal eine große tabelle ;) Wenn das klappt nimmst du nacheinander border, fontsize etc dazu aber lass das mit tausenden gefloateten neuen Tabellen..
 
okay stimmt, da kommt der Firefox wol durcheinander, aber warum nimmst du nicht einfach eine tabelle, der du mehrere tds und trs zuweist.. Habs im FF und IE getestet und beide kommen damit super klar.. nimm einfach die Style-Sachen raus und mach mal eine große tabelle ;) Wenn das klappt nimmst du nacheinander border, fontsize etc dazu aber lass das mit tausenden gefloateten neuen Tabellen..
Dann versuch das mal, wenn die Tabelle ein bisschen breiter ist. Was passiert? Richtig. Alles was rechts nicht auf das Blatt passt wird einfach kommentarlos weggelassen ;ugl Irgendwie noch blöder als so, wie es jetzt ist.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben