Plaatje + iframe onderaan pagina

[leeuwtjuh]

Hoe krijg je een plaatje + iframe onderaan een pagina? En wanneer je het scherm groter of kleiner maakt, dat ie nog steeds onderaan blijft? Zoals hier:
http://pootato.org/schemas/graphics/layouts/sakura/

Ook past de layout precies in het venster, zonder dat je een scrollbalk ziet aan de rechterkant, hoe kun je dit doen?
Wel komt er onderaan een scrollbalk als je het venster kleiner maakt, maar wanneer je dit niet doet past het precies, hoe kan dat?

Ik ben al op zoek geweest, maar ik heb niet echt iets kunnen vinden. Er is waarschijnlijk een handigheidje voor in CSS of HTML. Ik hoop dat jullie het weten..

Alvast bedankt

 

[Tha Devil]

Als ik het goed lees op die site is het alleen in HTML gemaakt (Valid XHTML 1.0) dus dat betekent dat je alles mooi in de bron op kan zoeken.

Maar wanneer ik op die hyperlinks klik dan wordt gewoon de hele pagina weer in dat frame weergegeven, zal wel komen omdat ik Safari gebruik...

 

[leeuwtjuh]

Ik heb al naar de code gekeken. Het is namelijk een downloadable layout. Dus ik heb de files en alles al gedownload, maar ik kom er niet uit. Daarom krijg je trouwens ook dezelfde pagina in dat venster ;]

 

[Tha Devil]

Dus die site waar je naar linkte is van jou zelf?

Wat is de site dan waar je hem kunt downloaden? Wellicht staat daar wat informatie voor je op (en anders de site van de maker van de template)

 

[leeuwtjuh]

Nee, het is niet mijn design. Hij komt van http://pootato.org (link naar pagina: http://pootato.org/graphics/designs/)
Ik heb al tussen de tutorials gekeken, maar ze hebben daar geen onderwerp over...

 

[Tha Devil]

Zo te zien hebben ze in de bron elke keer de positie op absoluut gezet.

#one {
	position: absolute;
	left: 0px;
	bottom: 268px;
	margin: 0px;
	padding: 0px;
}
#two {
	height: 144px;
	width: 309px;
	left: 491px;
	bottom: 268px;
	position: absolute;
	margin: 0px;
	padding: 0px;
}
#three {
	position: absolute;
	height: 246px;
	width: 491px;
	left: 0px;
	bottom: 22px;
	margin: 0px;
	padding: 0px;
}
#four {
	position: absolute;
	height: 246px;
	width: 309px;
	left: 491px;
	bottom: 22px;
	margin: 0px;
	padding: 0px;
	background: #E8E9E4 url(images/04.jpg) no-repeat fixed;
}
#five {
	position: absolute;
	height: 22px;
	width: 491px;
	left: 0px;
	bottom: 0px;
	margin: 0px;
	padding: 0px;
}
#six {
	position: absolute;
	height: 22px;
	width: 309px;
	left: 491px;
	bottom: 0px;
	margin: 0px;
	padding: 0px;
}

 

[leeuwtjuh]

Oké, wat doet dat absolute dan precies?
Ik zie wel bij five en six dat bottom 0px is, heeft dat er ook mee te maken?

 

[Tha Devil]

Oké, wat doet dat absolute dan precies?

http://www.katinkahesselink.net/webvisie/geentabel.html

Ik zie wel bij five en six dat bottom 0px is, heeft dat er ook mee te maken?

Waarschijnlijk zorgt dat ervoor dat hij echt aan de onderkant blijft. Het beste kun je dat controleren door die dingen te vervangen door een ander getal en dan kijken wat er veranderd is.

 

[leeuwtjuh]

Wanneer je die 0px veranderd dan gaat het hele plaatje omhoog, dus als je dat 0px laat dan gaat het goed. Dat snap ik nu wel denk ik.

Maar hoe komt het dan dat er rechts geen scrollbalk is?

 

[Tha Devil]

Waarschijnlijk omdat de inhoud niet de oppervlakte van het iframe overschrijdt.