Hallo, ich hab das mal getestet, die CSS Angaben dazu ausgelagert, wegen der Ordnung usw. ,-)
CSS:
* html div {
/* Star-Hack fuer InternetExplorer
* individuelle Anpassung
* je nach Hoehe des Inhaltes
*
* fuer IE Win \*/
height: 60%;
padding: 20% 0 0 0;
/* */ /* for Mac IE */
}
{
margin: 0;
padding: 0;
border-collapse:collapse;
border-spacing: 0;
}
html,
body {
height: 100%;
width: 100%;
color: #000000;
background-color: #FF9922;
line-height: 1.45;
}
body {
display: table;
font-size: 100.01%;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
div{
display: table-cell;
background-color: #FFFFFF;
vertical-align: middle;
text-align: center;
font-size: .8em;
}
p{
/*
* Stellvertreter Block-Elemente
*/
width: 10em;
height: 9.8em;
margin: auto;
border: 1px solid #000000;
background-color: #FF0000;
}
Html Datei:
<!doctype html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>xxxx</title>
<link rel="stylesheet" media="screen,projection" type="text/css" href="special.css" />
</head>
<body>
<div>
Dies ist ein Text
</p>
Dies ist ein Text
</div>
</body>
</html>
Das Ergebnis ist nicht unbedingt das, was ich erwartet hab.
