ToDo: Das HTML für das dreispaltige Layout vorbereiten

1. Ändern Sie die HTML-Struktur auf allen drei Webseiten wie folgt:

   <div id="wrapper">
   <div id="kopfbereich"> ...</div>
   <div id="textbereich">
   
   <div id="inhalt">
   <!-- Bisheriger Inhalt aus #textbereich -->
   </div> <!-- Ende inhalt -->
   
   <div id="sidebar">
   <h2>#sidebar</h2>
   <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
   <p>Suspendisse egestas ultricies pede.</p>
   </div> <!-- Ende sidebar -->
   
   </div> <!-- Ende #textbereich -->
   
   <div id="navibereich"> ...</div>
   <div id="fussbereich"> ...</div>
   </div>

2. Speichern Sie die Webseiten und betrachten Sie sie im Browser.

1. Ändern Sie ggf. die Hintergrundgrafik für #wrapper:
   #wrapper {
     color: black;
     background: white url(farbverlauf_dreispaltig.jpg) repeat-y;
     width: 720px;
     margin: 10px auto;
   }
2. Entfernen Sie das padding von #textbereich und verbreitern Sie ihn auf 590px.
   #textbereich {
     float: right;
     width: 590px;
   }
3. Ergänzen Sie die folgenden Styles in bildschirm.css wie folgt, am besten nach den Styles für den #textbereich:
   #inhalt {
     float: left;
     width: 430px;
     padding: 20px 10px 20px 20px;
   }
   #sidebar {
     float: right;
     width: 110px;
     padding: 10px;
   }
4. Speichern Sie das Stylesheet und betrachten Sie die Webseiten im Browser.