CSS-problem: fast footer/header och scroll mellan

Tråden skapades och har fått 14 svar. Det senaste inlägget skrevs .
1

Ciao!

Som vanligt upptäcker man att ens otroligt basic layout inte fungerar i IE Wintendo. I alla övriga browsers kör den utan problem. Om anledningen till att jag inte rakt av kan svaret på detta beror på temporärt eller kroniskt hjärnsläpp, eller bara på att hjärnan slappat till sig under semestern vet jag inte, men… jag tänkte att någon här på listan säkert sitter inne med en snabblösning på problemet, och kan bespara mig onödigt slitande av hår

Problemet består av en sida där jag vill ha en fast header och en fast footer, 0px från topp och botten. Dessa utgörs av två st div:ar, och utrymmet mellan dessa utgörs också av en div. Vad jag vill är att innehållet i huvud-div:en scollar när det fyller mer utrymme än vad som finns tillgängligt, vilket kan bero på litet fönster eller mkt innehåll.

Och det fungerar med bifogad kod utmärkt i de flesta testade browsers, bortsett från missfostret IE...

Så jag tackar på förhand för ev hjälp…

VH

Victor Spång Arthusson

**** kod ****

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transi...">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">

</style>
</head>
<body>
<div id="top">
testtext 1234567
</div>
<div id="content">
<p>Tillför placeholdertext här</p>
</div>
<div id="bottom">bottomtektst </div>
</body>
</html>

  • Medlem
  • Karlstad
  • 2005-08-12 17:16

Jag får inte top-diven att skrolla alls (FF och Safari). Har testat att fylla den med en massa text, och satt "scroll:auto" som det väl egentligen ska vara. No go...eller fattar jag fel? Med "huvud-diven", menar du #top eller #content?

Skit i det. Dum fråga när jag tittade efter lite bättre....:-\

Är det inte position: fixed som du är ute efter?

  • Oregistrerad
  • 2005-08-12 20:47
Ursprungligen av capojava:

Är det inte position: fixed som du är ute efter?

Funkar inte i IE. Den dag det gör det...

Sen finns det andra grejor med IE som inte funkar i andra läsare och som man skulle önska, såsom olika filter-effekter.

  • Oregistrerad
  • 2005-08-12 20:52

Jag har funderat mkt kring detta och kommit fram till att det CSS inte är helt moget än för vissa saker. I detta fall, med önskan om att fylla ut sidan tror jag det är bäst att återgå till tabell med korrekt inställning i CSS för det, om man vill köra med divs eller med vanliga <table>, <tr> och <td>. Sedan kan du lägga en div i mittencellen.

Å andra sidan är en lösning med iframe bättre än din nuvarande. Tror det ska funka.

  • Medlem
  • Karlstad
  • 2005-08-12 18:08

Har inte IE/Win just nu.
Men det måste väl vara NÅN slags höjd-definition nånstans, tror jag.
Haru testat en del standardlösningar typ:

body, html {
margin: 0;
padding: 0;
height: 100%;
}

...eller liknande?

Hej!

Uttryckte mig lite luddigt; jag menar den stora mitt-divven....

-> Danne: Jo, med höjd fungerar det, men jag vill ha en flytande layout, där oavsett vilken höjd som sätts så ska botten och topp-divvarna alignas upp och ner...

  • Medlem
  • Karlstad
  • 2005-08-12 19:30
Ursprungligen av scooterbabe:

Hej!

Uttryckte mig lite luddigt; jag menar den stora mitt-divven....

-> Danne: Jo, med höjd fungerar det, men jag vill ha en flytande layout, där oavsett vilken höjd som sätts så ska botten och topp-divvarna alignas upp och ner...

Jag har testat ett par olika "lösningar" som inte funkade alls. Men jag e ju ingen CSS guru direkt, så jag har kontaktat en man i Amörka som är en hävert på detta. Får se om han svarar (han är nog ute på långlunch...) och om han i så fall har nåt sätt. Om han inte vet, så vet ingen, och då får du nog försöka med en annan lösning. kanske finns det nåt javascript som hjälper (men då pajar ju sajten om folk har js avslaget). I sista fall: Gör ett enkelt frameset med botten-divven i neder-framen. Inte snyggt, och innegänget kanske spyr, men om man har lite integritet och ser till resultatet istället för medlen, så fungerar det ju klockrent i alla webbläsare....

  • Oregistrerad
  • 2005-08-12 19:34
Ursprungligen av scooterbabe:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transi...">

Börja med att köra på en strikt doctype, för att webbläsarna ska aktivera standard-kompatibilitetsläge.

Ursprungligen av svinto_deluxe:

Börja med att köra på en strikt doctype, för att webbläsarna ska aktivera standard-kompatibilitetsläge.

Mig veterligen går de bara i quirks-mode ifall man sätter doctype till "LOOSE" alternativt har en felaktig... Så IE borde inte gå i Quirksmode.

Eller menar du att du får det att fungera i IE Windows ifall du sätter strict?

  • Oregistrerad
  • 2005-08-12 20:24
Ursprungligen av scooterbabe:

Mig veterligen går de bara i quirks-mode ifall man sätter doctype till "LOOSE" alternativt har en felaktig... Så IE borde inte gå i Quirksmode.

Eller menar du att du får det att fungera i IE Windows ifall du sätter strict?

Alright, jag hade tydligen inte helkoll på det jag uttalade mig om, IE borde gå in i standardläge även med den utsatta doctypen.

Referens: http://msdn.microsoft.com/workshop/author/dhtml/reference/objects/doctype.asp

  • Medlem
  • Karlstad
  • 2005-08-12 20:00
Ursprungligen av svinto_deluxe:

Börja med att köra på en strikt doctype, för att webbläsarna ska aktivera standard-kompatibilitetsläge.

Nä, spelar ingen roll för IE/Win. Den går inte in in standardläge ändå, utan stannar på "almost standard":
http://hsivonen.iki.fi/doctype/

Bäst jag lägger till: Tror jag i alla fall. Med IE vet man inget med säkerhet.

-> Danne: Tackar för hjälpen - håller tummarna, och på frank spelar du Video killed the radiostar

Från en som inte har IE tillgängligt nu:
vad är det som inte funkar i IE?

Problemet är att jag inte kan få scroll på en absolut positionerad div (top left right bottom) utan att sätta en height på den. Gör jag inte det så bara växer den till höjden på innehållet....

1
Bevaka tråden