WN - Någon CSS-expert tillgänlig?

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - Någon CSS-expert tillgänlig? (https://www.wn.se/forum/showthread.php?t=28701)

Hej,
Jag har ett problem som verkar vara väldigt svårlöst enligt de flesta duktiga CSS-personer jag frågat.
Problemet är, som även är illustrerat i två screenshots nedan, att om "contents"-rutan har för mycket text/innehåll, så hamnar det bakom webbläsaren, högst upp, och man kan inte scrolla och se det eller något.

Om man kollar på index1.html, så är det precis så där designen ska se ut - dvs; designen ska vara placerad längst ner i webbläsaren, och desto mera information som fylls på, desto längre ska sidan bli.
Blir den emellertid längre än webbläsaren, så ska det givetvis bli en scroll (webbläsarens scroll, inte elementets), där man kan scrolla ner för att se det som är längst ner.

Ni får en större överblick över problemet genom dessa två screenshots. Jag har även tillhandlahållit nuvarande källkod för HTML-filerna (inkluderar nuvarande CSS-kod) samt bilderna om någon känner sig manad att prova på detta lokalt.
Observera att båda .html-sidorna är exakt lika dana, bara att index2.html innehåller mera brödtext, och därav blir det helt fel i layouten.

index1.html
http://linda.s9.se/baden/index1.gif
http://linda.s9.se/baden/index1.html

index2.html
http://linda.s9.se/baden/index2.gif
http://linda.s9.se/baden/index2.html

Källkod: http://linda.s9.se/baden/baden.rar

Skulle uppskatta om någon kunde hjälpa mig att lösa detta, då det verkar vara mer eller mindre omöjligt enligt de flesta :)
(Spelar ingen roll om du väljer att skriva om HTML/CSS-koden för att få det att fungera, jag uppskattar precis all hjälp jag kan få)

Tack på förhand!

Med vänliga hälsningar,
Johan

Nu ska jag testa om jag är kung på CSS som jag tror mig... tro... =)

Jag skulle nog sätta en overflow: auto på content så att du får en scroll på content-elementet när det behövs…

(Som jag förstår det är problemet att navigationen och logon försvinner när sidan är för lång?)

Citat:

Originally posted by martine@Apr 17 2008, 11:42
Jag skulle nog sätta en overflow: auto på content så att du får en scroll på content-elementet när det behövs…
(Som jag förstår det är problemet att navigationen och logon försvinner när sidan är för lång?)

Precis, men jag vill ha scroll på hela sidan, och inte bara elementet.
EDIT: 'overflow: scoll' på #contents verkar lösa mitt problem faktiskt - ska undersöka.

Testade sätta

top:50px; på wrapper och då verkade det bli bättre iaf. Dock tar bakgrunden slut då.

Hur ser din sås ut då? Av någon anledning så råkade jag ta bort filen, och nu hjälper det inte allts att sätta "overflow: scroll;" på #contents-elementet.

Jag testar lite.

Att det inte funkar med en scroll beror på att utbredningen sker uppåt pga vertical align
bottom.

Har fixat det, men försöker få bort scrolls som alltid finns...

EDIT: Jag lyckas bara om jag använder table som yttersta container. Lyckas inte med samma resultat med DIV, oavsett display.

Mercin, har du provat både med IE samt FF, och både med mycket contents och lite contents.
Fungerar det bra i båda webbläsarna så ska du ta tusen tack, skriv gärna i PM hur du lyckades :)

Jag kör alltid på floats och använder sällan position:absolute eller position:relative om det inte är avancerad grafik som kräver ett enstaka eller väldigt få element med det.

Vill inte predika något men det är det jag lärt mig från alla CSS bloggar, artiklar och podcasts av alla officella CSS nissar.

Skulle köra en uppsättning likt denna istället.

Kod:

<div id="container">

 <div id="branding">



 </div>

 <div id="navigation">

 <ul>..</ul>

 </div>

 <div id="col-a">

 <div id="sms">



 </div>

 </div>

 <div id="content">



 </div>

 <div id="col-b">



 </div>

 <div id="site-info">



 </div>

</div>

CSS koden har jag inte tid att skriva i nuläget och borde inte behövas :)

Bara mitt lilla tips klagar inte på nuvarande kod!

EDIT: Borde lösa det problem du har automatiskt.

Det framkom nu att eliasson är egentligen ute efter att positionera bakgrundsbilden på ett specifikt sätt.

Citat:

Originally posted by eliasson@Apr 17 2008, 10:08
Hej,
Om man kollar på index1.html, så är det precis så där designen ska se ut - dvs; designen ska vara placerad längst ner i webbläsaren, och desto mera information som fylls på, desto längre ska sidan bli.
Blir den emellertid längre än webbläsaren, så ska det givetvis bli en scroll (webbläsarens scroll, inte elementets), där man kan scrolla ner för att se det som är längst ner.

Tyckte det framgick ganska klart där, men jag har bestämmt mig för att göra om sidan lite efter direktiv från Marcin.

Moderatör kan stänga tråden - tack samtliga.