css float/position/height

[Gast]

Hallow iedereen

ja, misschien beetje raar onderwerp. Maar dat is dus mijn vraag

Ik wil een zo goed mogelijke website maken. Dus ik neem mijn basispagina(met wat standaard divs en stuff) en pas die wat aan.

Die pagina werkte met vaste afmeetingen. Niet echt geweldig. Dus dat moest veranderen.

Dan beginnen natuurlijk al die kaders te verspringen. En begin ik op allerlei site te kijken.

Kom ik iets tegen als 'clear: both'. Zeer handig voor de footer. Waarom ze mij dat niet leren op school snap ik niet...

...en nu zal ik stoppen met zeveren en over gaan tot mijn vraag.

Dit is de url: http://funyboyke.fu.funpic.de/test/

(sorry voor de irritante popup, is gratis host)

En het probleem is dat groen. Allé, eigenlijk dat geel.xD

Ik doe 'clear:both' op de footer(paars) waardoor hij bovenliggende divs mooi afsluiten.

..ik ben weer aant zeveren.

THE QUESTION: De gele div moet uitgerokken worden tot onderaan (tot tegen de paarse). Idem voor de roze.

Met ander woorden. De roze en gele moeten even groot zijn. Afhankelijk van de inhoud. Dus geen vaste afmeetingen.

Je kan de broncode wel bekijken wrss.

Dan zie je ook dat de gele en de roze, samen zitten in een oranje div. Mss dat ik daar iets mé kan doen?

Ik heb dus hulp nodig ivm met uitrekken van de div. Gewoon height:100% wil die natuurlijk niet doen.

greetz,

Fb

[Gast]

Ok, new question:

FranceVacances

menu centreren...

heb al zoveel verschillende sites bezocht, en niets wil werken.

Er staat ergens simpel met display block en dan auto left en right margin, maar wil die niet doen, wrss door het gebruik van floats en displays... maar hoe los ik dit nu op?

de tekst van het menu centreren, en de submenu items ook.

De code:

       <div id="menu">
    <ul id="nav">
     <li><a href="#" title="Home"><p>Home</p></a></li>
     <li><a href="#" title="Au Bernissan"><p>Au Bernissan</p></a>
       <ul>
       <li><a href="#" title="L'etable"><p>L'etable</p></a></li>
       </ul>
     </li>
     <li><a href="#" title="En Jean Mat"><p>En Jean Mat</p></a></li>
     <li><a href="#" title="Reservatie"><p>Reservatie</p></a></li>
     <li><a href="#" title="Situering"><p>Situering</p></a></li>
     <li><a href="#" title="Voorwaarden"><p>Voorwaarden</p></a></li>
     <li><a href="#" title="Contact"><p>Contact</p></a></li>
     <li><a href="#" title="Prijslijst"><p>Prijslijst</p></a></li>
     </ul>
      </div>  

Css:

#menu {
    width: 980px;
   height: 30px;
   margin: 0;
   padding: 0;
    background-image: url(buttonback.jpg);
 background-repeat: repeat;
 float:left; 
    position:relative;
 color: #454FA7;
     }

#menu ul {
  clear:left;
  float:left;
  list-style:none;
  margin:0;
  padding:0;
  position:relative;
  color: #454FA7;

}
#menu ul li {
  display:block;
  float:left;
  list-style:none;
  margin:0;
  padding:0;
  position:relative;
}
#menu ul li a {
  display:block;
  margin:0 0 0 1px;
  padding:3px 10px;
  text-decoration:none;
  line-height:1.3em;
}
#menu ul li a:visited{
    color: #454FA7;
}
#menu ul li a:hover {
    color:#3300CC;
}


#nav ul {
position: relative;
display: none;

}

#nav li:hover ul, #nav li.ie_does_hover ul {
display: block;

}

#nav a {
display: block;
}