[CSS]Problem z rozmiarem tła Opcje

[kosa351]

Witam,
mam sobie taki układ strony: klik. Mam pewien problem z tłem, a mianowicie chciałbym aby background kończył się wraz z końcem strony, a nie jak jest obecnie czyli ostatnią linijką tekstu.
Mój kod wygląda tak:

html

Kod

       <div id="pole_tekstowe">    
           <div id="tekst">
           <p>Lorem ipsum....</p>
           </div>
      
           <div id="stopka">
           stopka strony
           </div>
      
       </div>

css

Kod

       /* Pole tekstowe */
       #pole_tekstowe {
       width:100%;
       background-image:url(images/background.gif);
       }
      
       /* Tresc */
       #tekst {
       width:50%;
       margin-left:25%;
       background-color:#FFFFFF;
       height:auto;
       text-align:justify;
       padding:1% 1% 1% 1%;
       color:#000000;
       }
      
       /* Stopka */
       #stopka {
       width:50%;
       margin-left:25%;
       height:auto;
       color:#FFCC00;
       }

Proszę o pomoc jak napisać poprawny kod.

[kosa351]

Poszedłem za Twoją radą i zmodyfikowałem nieco kod, jednak nadal nie wiem jak nadać dla background odpowiedniej pozycji tak aby zaczynał się wraz z końcem dolnego menu (screen).

html

Kod

   <div id="header">
      
            <div id="navigation_hd">
               <ul>
               <li><a class="aktywny" href="index.html" >O FIRMIE</a></li>
               <li><a href="oferta.html" >OFERTA</a></li>
               <li><a href="zabiegi.html" >KONTAKT</a></li>
               </ul>
           </div>
              
   </div>
        
       <div class="chromestyle" id="chromemenu">
       <ul>
       <li><a href="#" rel="dropmenu1">Ogrodzenia</a></li>
       <li><a href="#" rel="dropmenu2">Bramy</a></li>
       <li><a href="#" rel="dropmenu3">Automatyka</a></li>
       <li><a href="#" rel="dropmenu4">Siatki</a></li>    
       <li><a href="#" rel="dropmenu5">Zabezpieczenia</a></li>    
       </ul>
       </div>
      
       <div id="tekst">    
       <p>Lorem.....</p>
       </div>
      
       <div id="stopka">    
       stopka strony
       </div>

css

Kod

body {
   font-family:"Arial", Times, serif;
   width:50%;
   height:auto;
   margin:auto;
   padding:1% 0% 0% 0%;
   background-image:url(images/background.gif);
   }
  
                       /* Naglówek  */
   #header {
   background-color:#FFFFFF;
   height:50px;
   text-align:left;
   }
  
                       /* Nawigacja nagłówek*/
   #navigation_hd {
   background-color:#FFFFFF;
   font-size:11px;
   font-weight:bold;
   }
  
   #navigation_hd li {
   float:left;
   list-style-type:none;
   }
  
   #navigation_hd li a {
   padding:0 12px;
   text-decoration:none;
   color:#000000;
   }
  
   #navigation_hd li a:hover {
   color:#E21015;
   }
  
   #navigation_hd li .aktywny {
   background:#FFFFFF url(images/arrow.png) no-repeat;
   color:#E21015;
   }
  
                       /* Tresc */
   #tekst {
   background-color:#FFFFFF;
   padding:3% 1% 1% 1%;
   text-align:justify;
   }
  
  
                       /* Stopka */
   #stopka {
   background-color:#FFFFFF;
   padding:3% 1% 1% 1%;
   color:#FFCC00;
   }