login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Footer in css positioneren

Offline Mythix - 10/03/2006 16:21
Avatar van MythixNieuw lid zoals er al velen gekomen en weer gegaan zijn zit ik ook met het probleem dat ik mijn footer niet op de juiste manier geplaatst krijg...

de footer moet dus onderaan de pagina staan ook als de contant van de site maar tot de helft van de pagina komt
als de content te groot is voor de pagina en er dus gescrolled moet worden, moet de footer uiteraard helemaal onderaan de content staan... ik heb al verschillende dingen geprobeerd, relatief, absolute, fixed, en alles wat ik kon vinden op internet maar niets werkte zoals ik het wilde hebben...

mijn footer is gewoon een <div id="footer">footer</div> onderaan de pagina (er zit nergens een container rond)

en de css ziet er momenteel als resultaat van mijn laatste probeerseltje zo uit:

#footer {
position: relative;
bottom: 10px;
width: 100%;
height: 22px;
background-image: url("images/footer.gif");
background-position: center;
background-repeat: no-repeat;
color: #FFFFFF;
font-size: 11px;
text-align: center;
font-family: verdana;
}

maar de footer plak gewoon onder de content in de helft van de pagina ipv helemaal onderaan de pagina...

Miss moet hier wel eens een apparte tut over gemaakt worden, want er zijn veel vragen over! maar dat is offtopic...

iemand een ID hoe ik het kan oplossen?

13 antwoorden

Gesponsorde links
Offline MindPrison - 10/03/2006 18:27
Avatar van MindPrison PHP gevorderde Ik heb ook lang dat probleem gehad, tot ik het zoeken opgaf, m.a.w: ik denk dat dit niet mogelijk is.

Indien je dit toch persé zo wilt oplossen, moet er javascript aan te pas komen..
Offline Crazed - 10/03/2006 18:29
Avatar van Crazed PHP interesse in javascript zit je natuurlijk wel met het probleem dat je footer dan telkens verspringt als je aan het scrollen bent. Toch bij de scripts die ik al gezien heb.

Als je echt onderaan je pagina een footer wil, dan zou ik met frames werken...
Offline Mythix - 10/03/2006 19:08
Avatar van Mythix Nieuw lid lol no thx, liever geen frames, hmm is wel raar dat dat niet kan ...

en als ik de div met de content in op height 100% zet, dan is hij niet 100% (over de hele pagina) maar dan is hij gwn eve groot als zijn inhoud ... dat zou toch niet mogen: 100% is alles wat vrij is innemen volgens mij ..
Offline dreamworld - 14/03/2006 01:26 (laatste wijziging 14/03/2006 01:27)
Avatar van dreamworld HTML beginner Dat wil ik ook wel eens weten. Ik ben ook bezig met een layout en de footer heb ik al helemaal onderaan staan nu, maar hij staat onderaan als m`n scherm gemaximaliseerd is, maar zodra ik em verklein staat ie nog onderaan maar kan ik scrollen en scrollt de footer niet mee, de footer staat dan ergens halverwege de pagina als ik helemaal naar beneden ben/heb gescrolled. Dit heb ik zowel in IE (6.0) en FF (1.5) Dus iets gaat er nog niet goed.

Enigste wat jij in je css moet veranderen is dit:

position: absolute; ipv relative en
bottom: 0px; ipv 10px

Zo heb ik het namelijk ook/wel. Dan heb je de footer al onderaan staan als het goed is, alleen heb je als het goed is ook het probleem wat ik nu heb. Ik heb het ooit voor elkaar gekregen, maar heb die layout weg gegooid om 1 of andere reden en laat ik daar nou net geen backup meer van hebben.....
Offline Ontani - 14/03/2006 01:43
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
ik heb eens even naar een oplossing gezocht.
30 seconden:

http://ontani.be/storage/uploads/footerEmpty.html
http://ontani.be/storage/uploads/footerFilled.html
Offline Riny - 14/03/2006 06:49 (laatste wijziging 14/03/2006 06:50)
Avatar van Riny Nieuw lid Werkt in FF wel,
maar in IE niet ;)
Offline dreamworld - 14/03/2006 22:37 (laatste wijziging 18/03/2006 21:33)
Avatar van dreamworld HTML beginner @Ontani: dit is niet helemaal wat ik bedoel/zoek.

Heb even een voorbeeld online gezet:
http://www.kabo...ayout.html

De onderste groene balk moet hoe dan ook onderaan de pagina komen, ongeacht de tekst in "het midden"

Zelf werk ik met een resolutie van 1280x1024 en de onderste groene balk staat dan netjes onderaan als ik de pagina voor het eerst bekijk. Maar als ik m`n scherm verklein staat ie nog steeds onderaan maar je kan scrollen en dan zie je dat ie na het scrollen niet meer onderaan staat.
Heb het getest met FF 1.5 en IE 6.0, bij beide hetzelfde probleem.
Offline haytjes - 14/03/2006 22:41
Avatar van haytjes Gouden medailleGouden medaille

JS gevorderde
bedoel je dan http://www.alis..._dom2.html zoiets?
Offline dreamworld - 14/03/2006 22:49
Avatar van dreamworld HTML beginner Dat is met Javascript en dat gebruik ik liever niet maar toch bedankt.
Offline Pieter - 14/03/2006 22:53 (laatste wijziging 14/03/2006 22:54)
Avatar van Pieter Gouden medaille

SEO guru
Eentje zonder javascript en frames, gewoon een css hoogstandje:
http://www.cssplay.co.uk/layouts/bodyfix.html
Verder moet je maar eens op cssplay.co.uk verderkijken, er staat vast en zeker wel iets bruikbaars tussen!

Edit - gevonden:
http://www.cssplay.co.uk/layouts/body2.html

Nu gewoon de rest nog wat wegfilteren en je hebt je onderste balk.
Offline Ontani - 14/03/2006 23:14
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
dit komt toch op't zelfde neer als een frame / iframe alleen is het een div met overflow, dus dit zal waarschijnlijk ook niet zijn bedoeling zijn.
Offline Pieter - 15/03/2006 00:42
Avatar van Pieter Gouden medaille

SEO guru
Tja, het is toch al beter voor de zoekmachines...
ik denk dat het mijn 2e voorbeeld is dat hij bedoelt.

Goeienacht!
Offline Realtec - 19/03/2006 00:18
Avatar van Realtec HTML interesse Ze zeggen wel dat tabellen niet bedoeld zijn om layouts mee te maken maar kijk wat een gerotzooi met divs... al die problemen ik ga er niet eens aan beginnen blijf mooi bij tabellen 
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.185s