Placer div's forskellige steder.

Hvordan mener du ?-)

<td style="width:200px;">
  <div style="width:200px;height:20px;background:#000;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#700;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#070;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#007;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#770;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#707;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#077;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#777;">&nbsp;</div></td>

Hovsa, min tabel, inkl. cellen deri, er 100% høj. Så nogen skal placeres i toppen, nogen i bunden :-)

Hvis du har gyldig doctype på, kan du:

<table style="height:100%;border-collapse:collapse;margin:0px;border:0px;padding:0px;">
  <tr>
  <td style="width:200px;height:100%;position:relative;vertical-align:top;margin:0px;border:0px;padding:0px;">
  <div style="width:200px;height:20px;background:#000;position:relative;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#700;position:relative;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#070;position:relative;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#007;position:relative;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#770;position:absolute;bottom:60px;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#707;position:absolute;bottom:40px;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#077;position:absolute;bottom:20px;">&nbsp;</div>
  <div style="width:200px;height:20px;background:#777;position:absolute;bottom:0px;">&nbsp;</div></td>
</tr>
</table>

Hvad hvis jeg ikke kender højden på mine div's? Tænker på dem i bunden :-)

-- du er nødt til at vide, hvordan du skal placere dem, for bottom virker kun med absolut positionering ...

Hmm, ok. Jeg har i stedet laver en tabel indeni min celle, som er 100% høj, og indeholder 2 rækker med hhv. vertical-align: top; og vertical-align: bottom;
Det løser problemet. Håbede dog, at kunne undgå en tabel indeni cellen, men det dur' da :-)

Laver du ikk' et svar?

Velbekomme '-)

-- og tak for point ;~}