WN

WN (https://www.wn.se/forum/index.php)
-   Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)
-   -   Container sträcka sig till "resten" av sidan? (https://www.wn.se/forum/showthread.php?t=28655)

viRioL 2008-04-15 22:27

Hej! Jag har precis pillat klart med en sida, för första gången i CSS, men det är fortfarande en sak som stör mig. Jag vill få en container att sträcka sig till "resten" av webläsarens höjd automatiskt. Har testat lite olika varianter men aldrig fått det att fungera (kolla på viriol.se, den vita containern som kallas för "kontenta"). Fick den att sträcka sig ännu längre en gång (med height: 100% och min-height: 100%, blev tvungen att scrolla) och då hängde inte conainern "menynere" med ner. Några förslag?
Tack!

Edit:
Vill alltså att det skall se ut så här:
fotbollpatv.nu/2.jpg
istället för så här:
fotbollpatv.nu/1.jpg

Magnus_A 2008-04-15 22:41

Det enkla svaret är att det går inte.
Men du kan göra något som ser hyggligt ut med hjälp av en bakgrundsbild som repeterar neråt och som har ett vitt fält i mitten, lagom där din container ska vara. Lägg en header där uppe och en footer därnere så är det klart sen.

grinditwp 2008-04-15 23:18

Citat:

Originally posted by viRioL@Apr 15 2008, 22:27
Hej Jag har precis pillat klart med en sida, för första gången i CSS, men det är fortfarande en sak som stör mig. Jag vill få en container att sträcka sig till resten av webläsarens höjd automatiskt. Har testat lite olika varianter men aldrig fått det att fungera (kolla på viriol.se, den vita containern som kallas för kontenta). Fick den att sträcka sig ännu längre en gång (med height: 100% och min-height: 100%, blev tvungen att scrolla) och då hängde inte conainern menynere med ner. Några förslag?
Tack
Edit:
Vill alltså att det skall se ut så här:
fotbollpatv.nu/2.jpg
istället för så här:
fotbollpatv.nu/1.jpg


Problemet, vad jag förstått. Är att om du sätter 100% height på tex en div-tag, så vet den inte vad den tar 100% av, då den utgår från elementet den ligger i.

Dock! Om vi sätter en storlek på bodyn, så bör det fungera! ;)

Lite CSS:
Kod:

<style>
html, body {
        margin: 0; padding: 0;
}
html, body {
        height: 100%;
}
.procent100 {
        height: 100%;
        width: 50%;
        background-color:#999999;
        margin: 0px auto 0px;
        text-align: center;
}
</style>

och sedan html:

Kod:

<div class="procent100">100% height</div>

Pixelstorm 2008-04-15 23:19

Kolla css:en för den här sidan: http://www.xs4all.nl/~peterned/examples/csslayout1.html
Borde lösa ditt problem..

viRioL 2008-04-16 00:56

Pixelstorm: det där borde ju fungera, men när jag lägger in CSS-koden på min sida så blir det hel-knäppt. Dels så får man scrolla jättelångt innan man kommer till botten och dels så slutar en av mina sidor att fungera helt (designen förstörs). Jag har säkert byggt hela min layout fel från början... :/


Alla tider är GMT +2. Klockan är nu 12:53.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson