nicht angemeldet
Hallo!
Oh man, noch ein Fehler entdeckt:
Jeweils bei <p> noch ein </p> statt <p> hintersetzen, sodass folgender Code entsteht:
XHTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "includes/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>GSG9 :: Clanpage</title>
<link rel="stylesheet" type="text/css" href="includes/gfx/layout.css" />
</head>
<body>
<div id="pageouter"><div id="pageinner"><!-- Seitenausrichtung Anfang -->
<div id="header"><!-- Header Anfang -->
<h2>Shoutbox</h2><!-- HINWEIS: fünf Zeilen passen höchstens -->
1. Zeile mit Inhalt | tlahnI tim elieZ .1 <br />
2. Zeile mit Inhalt | tlahnI tim elieZ .2 <br />
3. Zeile mit Inhalt | tlahnI tim elieZ .3 <br />
4. Zeile mit Inhalt | tlahnI tim elieZ .4 <br />
5. Zeile mit Inhalt | tlahnI tim elieZ .5 <br />
</div><!-- Header Ende -->
<div id="middle"><!-- Mittlere Reihe Anfang -->
<div id="leftnavi"><!-- Linke Navigation Anfang -->
<div id="leftbeam"> <!-- Linker Navigationsbalken --></div>
<div id="leftcontent"><!-- Linker Navigationsinhalt Anfang -->
<div id="leftheader"> <!-- Linker Navigations-Header --></div>
<div id="leftarea"><!-- Linker Navigations-Area-Bereich Bereich Anfang -->
<h2>Login</h2>
Loginscripte von PHP<br />
u.s.w. hier einfügen
<p>angemeldet?</p>
</div><!-- Linker Navigations-Area-Bereich Bereich Ende -->
<ul id="leftlinklist"><!-- Linker Navigations-Link-Liste Anfang -->
<li id="leftlinklistheader">Links</li>
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
<li id="leftlinklistfooter"> </li>
</ul><!-- Linker Navigations-Link-Liste Ende -->
</div><!-- Linker Navigationsinhalt Ende -->
</div><!-- Linke Navigation Ende -->
<div id="rightnavi"><!-- Rechte Navigation Anfang -->
<div id="rightbeam"> <!-- Rechter Navigationsbalken --></div>
<div id="rightcontent"><!-- Rechter Navigationsinhalt Anfang -->
<div id="rightheader"> <!-- Rechter Navigations-Header --></div>
<div id="rightarea"><!-- Rechter Navigations-Area-Bereich Bereich Anfang -->
<h2>Umfrage</h2>
Große Umfrage<br />
Jetzt neu!
<p>unkostenlos!</p>
</div><!-- Right Navigations-Area-Bereich Bereich Ende -->
<ul id="rightlinklist"><!-- Rechter Navigations-Link-Liste Anfang -->
<li id="rightlinklistheader">Links</li>
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
<li id="rightlinklistfooter"> </li>
</ul><!-- Rechter Navigations-Link-Liste Ende -->
</div><!-- Rechter Navigationsinhalt Ende -->
</div><!-- Rechte Navigation Ende -->
<div id="content"><!-- Inhalt Anfang -->
<h1>Ich bin der Seitentitel</h1>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
diam voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur
sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et
dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam
et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor
sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita
kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit ametur.
</div><!-- Inhalt Ende -->
</div><!-- Mittlere Reihe Ende -->
<div id="footer"><!-- Footer Anfang -->
<a href="disclaimer.php">Disclaimer</a>
| © 2005 by Su-Li-Son and The XMA
</div><!-- Footer Ende -->
</div></div><!-- Seitenausrichtung Ende -->
</body>
</html>
CSS-Code:
/* Allgemeingeltende Eigenschaften */
* {
overflow: hidden;
}
body {
background: #666666;
color: #000000;
font-family: Arial, sans-serif;
font-size: 16px;
padding: 0px;
margin: 0px;
}
div {
border: none;
margin: 0px;
padding: 0px;
}
h1,h2,h3,h4,h5,h6 {
font-weight: bold;
}
/* Einschließende <div>s der Seite */
div#pageouter {
width: 804px;
margin: 20px auto 20px;
}
div#pageinner {
border: 1px solid #666666;
}
/* Header <div> */
div#header {
padding: 27px 0px 0px 567px;
width: 237px;
height: 138px;
overflow: auto;
background: #666666 url('../../pictures/gfx/header.jpg')
no-repeat left top;
font-size: 12px;
color: #000000;
}
div#header h2 {
font-size: 15px;
text-decoration: none;
margin: 0px;
padding: 0px;
}
/* Mittleres Ausrichtungs <div> */
div#middle {
width: 804px;
background: #FF0000;
color: #000000;
}
/* Linkes Navigations <div> */
div#leftnavi {
float: left;
width: 183px;
height: 100%;
background: #666666;
color: #000000;
}
div#leftnavi div#leftbeam {
float: left;
width: 22px;
height: auto;
background: #666666 url('../../pictures/gfx/navi_left_beam.jpg')
repeat-y left top;
color: #000000;
}
div#leftnavi div#leftcontent {
width: 161px;
height: auto;
/*margin-left: 22px;*/
background: #666666 url('../../pictures/gfx/navi_left_bg.jpg')
repeat-y left top;
color: #000000;
}
div#leftnavi div#leftcontent div#leftheader {
width: 161px;
height: 7px;
background: #666666 url('../../pictures/gfx/navi_left_header.jpg')
no-repeat left top;
color: #000000;
}
div#leftnavi div#leftcontent div#leftarea {
background: #666666 url('../../pictures/gfx/navi_left_area_bg.jpg') repeat-y;
color: #000000;
background-position: 49px 0px;
height: auto;
width: 161px;
line-height: 21px;
margin-bottom: 20px;
}
div#leftnavi div#leftcontent div#leftarea h2 {
width: 143px;
height: 34px;
padding: 14px 0px 0px 18px;
background: #666666 url('../../pictures/gfx/navi_left_area_header.jpg')
no-repeat left top;
font-size: 13px;
color: #000000;
}
div#leftnavi div#leftcontent div#leftarea p {
width: 146px;
height: 18px;
padding: 2px 0px 0px 15px;
background: #666666 url('../../pictures/gfx/navi_left_area_footer.jpg')
no-repeat left top;
color: #000000;
font-size: 8px;
font-weight: bold;
}
Mit freundlichen Grüßen,
Adrian