webForumDet fria alternativet

100% height problem.

1 svar · 437 visningar · startad av KoTTeN

KoTTeNMedlem sedan sep. 20011 722 inlägg
#1

Hej!
Har med CSS anget att en div ska ha 100% höjd vilket fungerar fin fint. Men om jag nu har längre text i ett annat lager som gör att allt inte får plats i webbläsaren utan en scroll kommer fram går det inte ända ner, utan stannar där scrollen startar. Alltså där sidans visningsyta överstiger 100% slutar diven. Kan man på något sätt gå runt detta att den alltid ska ligga i botten oavsett scroll eller inte?

Tack på förhand!

SlarvpelleMedlem sedan mars 200459 inlägg
#2

Är inte säker på att jag förstod hur du menar. Det är riktigt att

html,
body,
div {height: 100%;}

anges i relation till webbläsarfönstrets höjd, inte sidans. Det finns ingen CSS egenskap som tvingar ett element att fortsätta till botten av sidan.

Däremot skulle du kunna placera en DIV med mycket text inuti en yttre DIV. På så sätt expanderas den yttre DIVen av den inre:

<div class="yttre">
<div>
Lorem ipsum...
</div>
</div>

Men lägg märke till att du i så fall inte kan använda "height: 100%" på den yttre DIVen eftersom den inres text då svämmar över (dock inte i IE, vilket är fel). Istället kan man använda "min-height":

html,
body {height: 100%;}
.yttre {min-height: 100%;}

men det förstås tyvärr inte av IE. En lösning på problemet skulle kunna vara att lägga till följande specialregel enbart för IE (och alltså dold för andra webbläsare):

.yttre {height: 100%;}

(Själv föredrar jag att gömma CSS enbart avsedd för IE i "Conditional comments".)

139 ms totalt · 3 externa anrop · v20260731065814-full.3ab8d573
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
136 ms — hämta tråd, inlägg och bilagor (db)