Christian Walgenbach: Media Print/Screen

Beitrag lesen

Hallo,

danke nochmal. habe es mit switch hinbekommen. Auch der Width:100% hat im Mozilla funktioniert. Nur der IE will nicht. Habe den Code mal mit Tabelle aus dem IE extrahiert und gepostet.

<!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>