Alareunaan div

#test
{
padding: 0 10px 10px 10px;
float: center;
width: 180px;
background: #f6f6f6;
}
/*tee esim tuollainen div css tiedostoosi sen jälkeen sinne html tiedostoon lisäät sen*/


Tässä sisltöä
tässä sen divin sisältöä

-------------------- css --------------------

   #iso {
      border: 1px solid Black;
   }
   #pieni {
      background: #FFEFD5;
      position: relative;
      bottom: 0;
   }



-------------------- html --------------------



   Lorem Ipsum is simply dummy text of the printing and typesetting industry.
   
   
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent semper ligula ut nisl.
   


----------------------------------------

Nyt on pää vähän jumissa. Jos asetetaan tuon mukaisesti isolle korkeus, niin pieni ei kyllä mene alareunaan. Ei jaksa miettiä enempää, jos joku tietää korjauksen niin kertokoon.

Testi

   #ulompi
   {
      position: relative;
      width: 30em;
      height: 20em;
      border: 1px solid #000;
   }

   #sisempi
   {
      position: absolute;
      left: 0;
      bottom: 0;
      background-color: #FF0;
      width: 100%;
      height: 3em;
   }





Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

   
   Curabitur eu sapien et leo nonummy consequat.
   





Avainasemassa on ulommalle diville annettu "position: relative;" -määritys, jonka ansiosta absoluuttisesti sijoitetun sisemmän divin koordinaatit (left ja bottom) lasketaan suhteessa ulomman divin reunojen sijainteihin.