Hallo liebe html.de Gemeinde,
ich bin dabei eine Website zu erstellen und komme mit dem Layout nicht weiter.
Ich benutze dazu den phase 5.6 editor.
Die Site soll mal so aussehen wie auf dieser Word Datei
RapidShare: 1-CLICK Web hosting - Easy Filehosting
Probleme habe ich mit den "Schatten" der einzelnen Boxen, dem Abstand und auf 4:3 Monitoren verziehen sich die Kästen, die auf meinem 16:9 passen.
Bin für jede Hilfe dankbar.
Mein bisheriger Ansatz sieht so aus:
<!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">
<head>
<meta http-equiv="content-type"
content="text/html; charset=iso-8859-1" />
<style type="text/css">
body, html {
margin: 0;
padding: 0;
background-color:#F2F3D0;
}
body {
font-size: 100%;
font-family
anRoman;
}
p {
margin: 15px 25px 0 25px;
}
h1 {
margin: 0 25px;
padding: 25px 0;
font-size: 1.3em;
}
ul#Navigation a {
margin: 2px 25px;
padding: 0px 25px;
}
#kopf {
background-color: #DFF6F7; border:solid 1px;
}
#navigation {
background-color:#EDB5A0; margin-left:25%; width:13%;
float:left; border:solid 1px; padding:7px;
}
#inhalt {
background-color: #E9E7F9; padding:18px; float:center; border:solid 1px; margin-left:39%;
margin-right: 25%
}
#container {
background-color:#1802FF; width:50%;
margin-left:auto; margin-right:auto;
}
</style>
<title></title>
</head>
<body>
<div id="container">
<div id="kopf">
<h1> <p align="right"></p></h1>
</div>
</div>
<div id="navigation">
<h1>Navigation</h1>
<ul>
<p><li><a href="Startseite.html">Startseite</a></li>
<li><a href="Zur Person.html">Zur Person</a></li> </p>
</ul> </p>
</div>
<div id="inhalt"> <p></p>
<h1></h1> <p></p>
<p></p>
<p></p>
<p></p>
<ul>
<li>text</li>
<li>text</li>
<li>text</li>
<p></p>
</div>
</div>
</body>
</html>
ich bin dabei eine Website zu erstellen und komme mit dem Layout nicht weiter.
Ich benutze dazu den phase 5.6 editor.
Die Site soll mal so aussehen wie auf dieser Word Datei
RapidShare: 1-CLICK Web hosting - Easy Filehosting
Probleme habe ich mit den "Schatten" der einzelnen Boxen, dem Abstand und auf 4:3 Monitoren verziehen sich die Kästen, die auf meinem 16:9 passen.
Bin für jede Hilfe dankbar.
Mein bisheriger Ansatz sieht so aus:
<!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">
<head>
<meta http-equiv="content-type"
content="text/html; charset=iso-8859-1" />
<style type="text/css">
body, html {
margin: 0;
padding: 0;
background-color:#F2F3D0;
}
body {
font-size: 100%;
font-family
anRoman;}
p {
margin: 15px 25px 0 25px;
}
h1 {
margin: 0 25px;
padding: 25px 0;
font-size: 1.3em;
}
ul#Navigation a {
margin: 2px 25px;
padding: 0px 25px;
}
#kopf {
background-color: #DFF6F7; border:solid 1px;
}
#navigation {
background-color:#EDB5A0; margin-left:25%; width:13%;
float:left; border:solid 1px; padding:7px;
}
#inhalt {
background-color: #E9E7F9; padding:18px; float:center; border:solid 1px; margin-left:39%;
margin-right: 25%
}
#container {
background-color:#1802FF; width:50%;
margin-left:auto; margin-right:auto;
}
</style>
<title></title>
</head>
<body>
<div id="container">
<div id="kopf">
<h1> <p align="right"></p></h1>
</div>
</div>
<div id="navigation">
<h1>Navigation</h1>
<ul>
<p><li><a href="Startseite.html">Startseite</a></li>
<li><a href="Zur Person.html">Zur Person</a></li> </p>
</ul> </p>
</div>
<div id="inhalt"> <p></p>
<h1></h1> <p></p>
<p></p>
<p></p>
<p></p>
<ul>
<li>text</li>
<li>text</li>
<li>text</li>
<p></p>
</div>
</div>
</body>
</html>
