Footer lalltid ängst ner på sidan.

Nu har jag googlat hela kvällen efter sticky footers, men de lösningar jag har hittat funkar inte om man, som jag, dels har en kort sida som slutar mitt på skärmen om man tittar på en högupplöst skärm, dels har längre sidor som man får skrolla. De funkar fint på den korta sidan, där lägger sig footern längst ner som jag vill, men problemet är att de ligger kvar på samma ställe även på mina längre sidor, och hamnar då mitt i texten. Jag skulle helst vilja ha en lösning där footern ligger kvar vid botten av skärmen var man än är på sidan, ungefär som Facebooks blå kant överst gör, fast tvärtom då...
Det här kanske inte ens heter sticky footer...

Tack, det fick footern att funka som jag vill, dvs alltid ligga utanpå
Det medförde dock att min "content"-del inte sträcker sig hela vägen till footern.

Sätter jag höjden till 100% på html, body så blir det så här på de längre sidorna

dvs "content"-delen tar slut där "folden" tar slut.

html,body{margin:0;padding:0; height: 100%;} 
html { overflow-y: scroll; }
img {border:0;} /* No border around linked images */

header,footer,nav,article,section,aside,figure,figcaption{display:block;}

html {background: #ddebc7; }

body {
  margin: 0px auto;
  width: 950px;
  background: #ddebc7;
  -webkit-box-shadow: 0px 0px 30px rgba(50, 50, 50, 1);
  -moz-box-shadow:    0px 0px 30px rgba(50, 50, 50, 1);
  box-shadow:         0px 0px 30px rgba(50, 50, 50, 1);
  font-family: 'Rambla', sans-serif;
  font-size: 100%;
  color: #222222;
  margin-bottom: -80px;
}

header#top,
div#content, 
footer#bottom{margin:0 auto;width:950px;}

#footer {
  position: fixed;
  bottom: 0px;
  width:950px;
  height:80px;
  background:url(../img/footer.png);
  clear:both;
  text-align: center;
  padding-top: 20px;
  font-family: 'BenchNine', sans-serif;
  color: #000000;
  font-size: 110%;
}

Så ser vidkommande CSS-kod ut

edit, det funkar om jag lägger på en omslutande wrapper och sätter min-height 1000px, men jag skulle ju vilja ha en relativ höjd....

Antar att du menar 1000px? Annars hjälper det inte så mkt..jo det funkar, men jag skulle vilja ha en relativ höjd, nu måste den ju vara minst 1000px även när upplösningen på skärmen är lägre = onödigt skroll. Visst, visuellt spelar det ingen roll, fotern ligger ju där den ligger, men blir irriterad att det är så svårt att lösa höjden relativt, iaf för mig...

Fast då blir content för kort..

Det ser ut som på 1:a bilden, med den skillnaden att content slutar ca 100px under bilden. Om jag sätter min-höjd till 600px ser det bra ut på 1920x1080 skärm, content går hela vägen ner till footern, och så mkt större skärmar är det få som har. (Väl?) Ja, med overflow.

Jag har inte gjort annat än tankenötat ;). Jag får det till att det borde vara min-height=100%, men det funkar ju inte..får det endast att funka om jag skriver antalet pixlar och det => än fönstrets höjd.

Mm, jag tycker det...men då ser det ut som på 1:a bilden. Det spelar ingen roll om jag sätter min-height 100% på content, body, html eller om jag gör en omslutande wrapper med min-height, det vill sig inte.
Nu har jag min-height 600px på content och overflow auto och då ser det bra ut, men så vill jag helst inte lösa det.

Funkar inte så för mig Jag kan ju ta bort skuggan och då lär det inte synas, mem det är ju fusk..

Jag tror jag provade båda, men ingen av dem lägger footern utanpå. Dessutom fick jag dem inte att funka på de längre sidorna, har jag för mig. Men tack iaf

Ja, precis, jag vill ha skuggan som en "kant" hela vägen ner till footern:

Som synes löste jag det, delvis på fegisvis, genom att lägga till en aside vilket i sig gjorde att sidan blev längre, och footern hamnade på rätt ställe. Footern ligger alltid utanpå (tack vara din kodsnutt) och jag satte min-height på "content" till 600px och overflow:auto. Då verkar det funka på en helt tom sida också: