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

verschiedene Ausgabemedien

P

piranja

Neues Mitglied
Hallo zusammen.
Ich habe Folgendes vor:
Ich möchte auf einer Seite unterscheiden zwischen der Bildschirm- und der Druckausgabe.
Es handelt sich um eine Tabelle, in der ich eine Zelle habe, deren Inhalt auf dem Bildschirm ein anderer sein soll als beim Druck.
Ich hatte mir das so gedacht:

CSS im <head>:

@media screen {
.print { display:none; }
.screen { display:inherit; }
}
@media print {
.print { display:inherit; }
.screen { display:none; }
}

und dann im Seitencode gebe ich zwei Tabellenzellen an, eine mit class="print" und eine mit class="screen". Es soll dann, je nach Ausgabemedium, immer nur eine der beiden angezeigt werden.

Funktioniert auch im IE prima, allerdings im Firefox zerschießt es mir die ganze Tabellenstruktur.

Muss ich etwas beachten, oder gibt es für dieses Vorhaben eine andere Lösung?

Danke für eure Hilfe!
piranja
 
Hallo,

um dir konkret helfen zu können solltest du den gesamten Quelltext bereitstellen, am besten gleich online als Link.

Im Prinzip ist deine Überlegung richtig, das mache ich ähnlich, aber halt ohne Tabellen.

Fraglich ist allerdings, ob "display: inherit" in deinem Fall sinnvoll ist. Und auch der Hinweis

gebe ich zwei Tabellenzellen an
Zum Vergrößern anklicken....

klingt für mich weder logisch noch nachvollziehbar. Aber ohne den Quelltext ist eh' alles nur Raterei.

Gruss

MrMurphy
 
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
@media screen {
.print { display:none; }
.screen { display:inherit; }
}
@media print {
.print { display:inherit; }
.screen { display:none; }
}
</style>
</head>

<body>
<table border="1">
<thead>
<tr>
<th colspan="4" scope="col">Test</th>
</tr>
</thead>
<tbody>
<tr>
<td class="screen">
Screen 0
</td>
<td class="screen">
Screen 1
</td>
<td class="screen">
Screen 2
</td>
<td class="screen">
Screen 3
</td>
<td colspan="4" class="print">
Druckausgabe
</td>
</tr>
<tr>
<td colspan="4">
Summe
</td>
</tr>
</tbody>
</table>
</body>
</html>
 
Hallo,

ersetz mal die beiden

display:inherit

durch

display:inline

Ich wüßte auch nicht, das inherit als Wert von display überhaupt zulässig ist.

Gruss

MrMurphy
 
Hey, ok, das hat schonmal geholfen, danke dir.
Aber sobald ich jetzt mit colspan und rowspan arbeite, habe ich wieder das selbe Problem - im IE ist alles bestens, im Firefox alles kreuz und quer.

Bsp.:

<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
@media screen {
.print { display:none; }
.screen { display:inline; }
}
@media print {
.print { display:inline; }
.screen { display:none; }
}
</style>
</head>

<body>
<table border="1">
<thead>
<tr>
<th colspan="4" scope="col">Test</th>
<th>x</th>
</tr>
</thead>
<tbody>
<tr>
<td class="screen">
Screen 0
</td>
<td class="screen">
Screen 1
</td>
<td class="screen">
Screen 2
</td>
<td class="screen">
Screen 3
</td>
<td colspan="4" class="print">
Druckausgabe
</td>
<td rowspan="2">x</td>
</tr>
<tr>
<td class="screen">
x
</td>
<td class="screen">
x
</td>
<td class="screen">
x
</td>
<td class="screen">
x
</td>
<td colspan="4" class="print">
y
</td>
</tr>
<tr>
<td colspan="5">
Summe
</td>
</tr>
</tbody>
</table>
</body>
</html>
 
Hallo,

komisch, irgendwie meine ich geschrieben zu haben

den gesamten Quelltext
Zum Vergrößern anklicken....

Wenn einem der Quelltext immer nur bröckchenweise hingeworfen wird und auf eine Lösung immer die Antwort: "Das funktioniert aber nicht, weil ich hab' da noch mehr, was ich aber erst jetzt bekanntgebe..." erhält ist das ziemlich frustrierend.

Die Zellen sollen also wahrscheinlich gleich breit sein. Dann ersetz mal

display:inline

durch

display:table-cell

Gruss

MrMurphy
 
Falsch, zum Zeitpunkt des ersten Posts war dies der gesamte Quelltext. Ich habe ihn erst später erweitert.
Trotzdem danke für deinen Tipp, mit "table-cell" erhalte ich nun das gewünschte Ergebnis. Prima!

Lieben Gruß, piranja
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben