Hallo Leute,
habe irgendwie mit meinen erstellten Layout ein Problem, dass der Text aus der "Textebene" aus dem kompletten Layout einfach so hinausläuft. bin irgendwie ratlos und weiß nicht woran es liegen könnte.
Wundert euch nicht über die länge der CSS-Datei is die vollständige CSS für das Layout. Hab leider auch noch nicht alles bestens sortieren können, hoffe ihr kommt zurecht. 
CSS:
Code
/* --------- Allgemeines ---------- */
* { margin: 0; padding: 0; }
body {
background: url(img/background.gif) top left repeat;
}
h1 {
font-size: 24px;
font-family: Georgia, "Times New Roman", Times, serif;
}
/* ---------- Container ----------- */
#wrapper {
margin: 0 auto;
width: 870px;
padding: 0;
border-left: 1px solid #999999;
border-right: 1px solid #999999;
border-bottom: 1px solid #999999;
}
/* ------------ oberer Bereich ----------- */
#oben {
height: 20px;
background: #fff url(img/oben.gif);
border-bottom: 1px solid #999999;
}
/* ----------- Header-Bereich ------------ */
#header {
height: 120px;
background: #f3f3f3;
margin: 0;
padding: 0;
border-bottom: 1px solid #999999;
}
#logo {
float: left;
width: 162px;
height: 120px;
background: url(img/logo.jpg);
margin: 0;
padding: 0;
}
#title {
float: left;
width: 400px;
height: 50px;
font-size: 24px;
/*border: 1px solid #000;*/
margin-top: 45px;
/*padding-left: 15px;*/
}
.slogan {
padding-top: 5px;
font-size: 20px;
padding-left: 45px;
font-style: italic;
}
/* ------------ Navigation 1 ------------- */
.nav1 {
float: right;
margin-top: 15px;
margin-right: 15px;
padding: 0;
}
.nav1 ul {
margin: 0;
padding: 0;
list-style: none;
}
.nav1 li {
display: inline;
margin: 0;
padding: 0;
}
.nav1 li a {
display: inline;
font-size: 9pt;
color: #666666;
padding-left: 5px;
padding-right: 5px;
text-decoration: none;
border-left: 1px solid #999999;
border-right: 1px solid #999999;
}
.nav1 a:hover {
color: #000;
font-weight: bold;
text-decoration: underline;
}
/* -------------- Navigation 2 -----------------------*/
.nav2 {
float: left;
width: 200px;
margin: 15px 15px;
border: 1px solid #999999;
}
.nav2 ul {
margin: 0;
padding: 0;
list-style: none;
}
.nav2 li {
display: block;
margin: 0;
padding: 0;
background-repeat: no-repeat;
}
.nav2 li.menukopf {
color: #fff;
height: 20px;
background-color: rgb(115,0,24);
font-size: 14px;
line-height: 21px;
padding-left: 20px;
text-transform:uppercase;
}
.nav2 li a {
display: block;
color: #000;
/*background-color: #d9d9d9;*/
background-color: #efeeee;
background-image: url(img/arrow.gif);
background-repeat: no-repeat;
background-position: 0 -28px;
padding: 3px 0px 3px 20px;
text-decoration: none;
}
.nav2 a:hover {
/*background-color: #fff; */
background-image: url(img/arrow.gif);
background-repeat: no-repeat;
background-position: 0 8px;
text-decoration: none;
/*border-bottom: 1px solid #999999;*/
}
/* ------------------ Navigation 2 Formular ---------------------------- */
.nav2 li form {
margin-top: 10px;
margin-left: 20px;
margin-bottom: 15px;
}
.fields {
border: 1px solid #999999;
}
#loginbutton {
margin: 0;
padding: 0;
}
#formlink {
color: #000;
font-size: 12px;
background: none;
margin: 0;
padding: 0;
}
/* -------------- Menu-Container ---------------------*/
#menu_container {
width: 870px;
min-height: 500px;
background-color: #fff;
}
/* --------------- Nav Container -------------------- */
#navcontainer {
float: left;
width: 200px;
height: auto;
margin: 0;
padding: 0;
}
/* ----------------- Content ------------------------ */
#content {
float: left;
margin-top: 15px;
padding-left: 50px;
padding-right: 20px;
}
/* -------------- Footer ---------------------------- */
#footer {
float: left;
clear: left;
width: 870px;
height: 40px;
color: #fff;
background-color: rgb(115,0,24);
font-size: 11pt;
text-align: center;
line-height: 40px;
}HTML:
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Meine Homepage</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="wrapper">
<div id="oben"></div>
<div id="header">
<div id="logo"></div>
<div id="title">Ihre Firmenname
<div class="slogan">Ihr Slogan</div>
</div>
<div class="nav1">
<ul>
[*][url='#']Startseite[/url]
[*][url='#']Kontakt[/url]
[*][url='#']Impressum[/url]
[/list]
</div>
</div>
<div id="menu_container">
<div id="navcontainer">
<div class="nav2">
<ul>
<li class="menukopf">Menu
[*][url='#']Startseite[/url]
[*][url='#']Registrierung[/url]
[*][url='#']Produktkatalog[/url]
[*][url='#']AGB[/url]
[*][url='#']FAQ[/url]
[*][url='#']Impressum[/url]
[/list]
<ul>
<li class="menukopf">Login
[*]
<form class="loginbox" method="post" action="">
<label>Benutzername:</label><input class="fields" type="text" name="benutzer" />
<label>Passwort:</label><input class="fields" type="password" name="passwort" />
[url='#']Passwort vergessen?[/url]
<input type="submit" id="loginbutton" name="Submit" value="Login" />
</form>
[/list]
</div>
</div>
<div id="content">
<h1>WillkommenWillkommen</h1>
&fdsdfjapofjasopfjopasdjfölkasjfölkasjfkölshflöshdfklshadfölkasfklöhsdföklashfkölhsadfklsadlöfksklöfhsdalfhasöklhföklashdfkölashdflöhföklshdaflönbsp;</p>
</p>
</div>
</div>
<div id="footer">copyright @ 2008 by Ihr Firmenname</div>
<br style="clear: both;" />
</div>
</body>
</html>Hoffe ihr könnt mir weiterhelfen, dass der Text dann wenn er zulange ist auf der nächste Zeile weitergeführt wird. Bin schon recht verzweifelt, da dass Layout schon kurz vor der Auslieferung steht. 
PS:
Wenn jemand noch ein paar IE 6 Hacks hat oder so wäre ich euch sehr dankbar, da ich MS Vista habe und es somit auf dem IE 6 nicht testen konnte.
Mit freundlichen Grüßen
Christian
