jafix: Warum will der Text in meinem DIV nicht umbrechen???

Beitrag lesen

Hallo zusammen!

Ich habe das Problem das ich gerade von Tabellen weg kommen möchte und daher mich in DIV's einarbeite. Doch nun habe ich das Problem, das ich obwohl ich width gesetzt habe der Text nicht umbricht.
Mein Layout besteht ganz einfach aus nur zwei Spalten.

Daher meine Frage: Was mache ich falsch, dass mein Text nicht umbricht?

Er sollte einfach umbrechen un den Container ggf. höher machen.

##################Mein Code der html Datei:################################

<html>
<head>
 <title>
 Zwei DIV's
 </title>

<style type="text/css" media="all">@import url("css_layout.css");</style>
</head>

<body>
 <div id="content">
  <pre>
Dies ist Container Nummer 1 welcher einmal das Navigationsmenü enthält.
  </pre>
 </div>

<div id="content2">
  <pre>
Dies ist Container Nummer 2 welcher einmal den Hauptinhalt enthält.
  </pre>
 </div>
</body>

</html>
##################Ende Code der html Datei:################################
##################Mein Code der css Datei:#################################
body {
 margin: 0px 0px 0px 0px;
 padding: 0px 0px 0px 0px;
 font-family: verdana, arial, helvetica, sans-serif;
 color: #ccc;
 background-color: #333;
 }
a {
 text-decoration: none;
 font-weight: bold;
 color:  #ccc;
 outline: none;
 }
a:visited {
 color:  #ccc;
 }
a:active {
 color:  #ccc;
 }
a:hover {
 color: #ccc;
 text-decoration: underline;
 }
.ahem {
 display: none;
 }
strong, b {
 font-weight: bold;
 }
p {
 font-size: 12px;
 line-height: 22px;
 margin-top: 20px;
 margin-bottom: 10px;
 }

h1 {
 font-size: 24px;
 line-height: 44px;
 font-weight: bold;
 margin-top: 0;
 margin-bottom: 0;
 }
h2 {
 font-size: 18px;
 line-height: 40px;
 font-weight: bold;
 margin-top: 0;
 margin-bottom: 0;
 }
h3 {
 font-size: 16px;
 line-height: 22px;
 font-weight: bold;
 margin-top: 0;
 margin-bottom: 0;
 }
h4 {
 font-size: 14px;
 line-height: 26px;
 font-weight: bold;
 margin-top: 0;
 margin-bottom: 0;
 }
h5 {
 font-size: 12px;
 line-height: 22px;
 font-weight: bold;
 margin-top: 0;
 margin-bottom: 0;
 }
h6 {
 font-size: 10px;
 line-height: 18px;
 font-weight: bold;
 margin-top: 0;
 margin-bottom: 0;
 }
img {
 border: 0;
 }
.nowrap {
 white-space: nowrap;
 font-size: 10px;
 font-weight: bold;
 margin-top: 0;
 margin-bottom: 0;
 }
.tiny {
 font-size: 9px;
 line-height: 16px;
 margin-top: 15px;
 margin-bottom: 5px;
 }
#content {
 float: left;
 padding: 10px 2% 10px 2%;
 margin: 20px 1% 20px 2%;
 background: #666;
 border: 5px solid #ccc;
 width: 200px;
 }
html>body #content{}
#content2 {
 float: left;
 padding: 10px 2% 10px 2%;
 margin: 20px 2% 20px 1%;
 background: #666;
 border: 5px solid #ccc;
 width: 800px;
 }
html>body #content2 {}
pre {
 font-size: 12px;
 line-height: 22px;
 margin-top: 20px;
 margin-bottom: 10px;
 }
##################Ende Code der css Datei:#################################