web pozicionálás

Web, mail, IRC, IM, hálózatok

Lenne két gondom, amin nem tudok átlépni egy div-vel.Az első, hogy egy adott div aljától és jobb szélétől 5px-re szeretnék egy egy képet rakni. Azaz hogy a kép jobb alsó sarka a div jobb alsó sarkától 5-5-re legyen balra és fel. Mint az oldalszám egy lapon.
A div-em így néz ki most: 


      div.page {
		  background-color: white;
		  border: thin solid black;
                 /* Csak ideiglenesen */
		  height: 50em;
		  margin: 20px 20px 20px 20px; 
		  display: block;
	       }

A másik, az ennek a div-nek magassága. Most beállítottam 50em-re, de azt szeretném, hogy akkor is töltse ki a max képet, ha nincs benne semmi.

Az egész lap abból állna, hogy van a body egy háttérszínnel, rajta egy div kerettel, meghagyva 20px részt körbe a háttérből.

  • 1212 megtekintés

Egy kis ábra segítene, hogy pontosan mit akarsz megvalósítani.
Ami nekem nem világos: egy képet akarsz beilleszteni az oldalba html használatával, vagy egy képet háttérképként css használatával.
Vagy másold be a html részletet, abból is ki lehet indulni, de nem szeretném kivesézni az összes szóbajöhető lehetőséget.

SZia, akkor csak egy képet akarsz beszúrni (nem háttérképként).

div.page {
background-color: white;
border: thin solid black;
/* Csak ideiglenesen */
height: 50em;
margin: 20px 20px 20px 20px;
position: relative;
}
img
{
position: absolute;
bottom: 5px;
right: 5px;
}

Itt az a lényeg, hogy mivel a befoglaló divnek relatív pozicionálást adsz meg, a benne lévő elem ehhez képest kerül elhelyezésre ha absolute van pozicionálva. Remélem világos :)
Bordernek pedig célszerűbb px-ben megadni a méretét, mert úgy mindegyik böngészőben ugyanannyi lesz a vastagsága.

szerkesztve: divnek felesleges a display: block attribútumot megadni.