Søg
Avatar billede nak-m Nybegynder
20. oktober 2003 - 06:55 Der er 28 kommentarer og
1 løsning

100 procent højde på div

Mit spørgsmål skulle gerne være ganske simpelt.
Hvordan sætter jeg min divs højde til 100 procent, når siden har overflow? Jeg kan kun få den til strække den til det umiddelbart visuelle.
Avatar billede jakobclausen Nybegynder
20. oktober 2003 - 07:33 #1
height="100%" ?
Avatar billede nak-m Nybegynder
20. oktober 2003 - 07:39 #2
Ups ... jeg skulle vidst have smidt mit spørgsmål i css kategorien. Det var det jeg mente. Og desuden skriver jeg min side i xhtml så jeg kan ikke bruge heightegenskaben.

Altså, hvordan får jeg min divs højde til at strække sig 100 procent - inklusive overflow - i css?
Avatar billede mik789 Nybegynder
20. oktober 2003 - 08:25 #3
du skal sørge for at alle de omgivne bokse også har tildelt højde. Browseren kan kun udregne relativ højde for din div, hvis der er noget omgivende højde at regne den ud efter.

men hvis det du fylder i din div rent faktisk ikke fylder hele skærmen og de omgivende elementer heller ikke gør det, kan du heller ikke uden videre gøre det med css. Det enklesete er måske at lægge en lille transparent gif på 1px i bredden og en fast højde der er så stor som du vil have den i diven. Elles kan du jo forsøge med nogle ekstra store padding- eller margin-mål. F.eks. margin-bottom: 300px; det burde vel også kunne gøre det.
Avatar billede roenving Novice
20. oktober 2003 - 08:43 #4
-- og en af måderne at sikre sig at de omgivende elementer har den tilstrækkelige højde er også at tage html og body med:

html,body{height:100%;}
Avatar billede =maddog= Nybegynder
20. oktober 2003 - 09:17 #5
problemet er at % selvsagt ikke betyder % skærmhøjde i CSS, men derimod den relative størrelse i forhold til en anden fast angivet størrelse. Hvis en sådan ikke findes fortolkes en %-værdi som "auto".
Derfor roenving's stunt. Det virker ikke i alle browsere, men det er bedre end ingenting.
ref: http://www.eksperten.dk/spm/398884
Avatar billede mik789 Nybegynder
20. oktober 2003 - 10:22 #6
=maddog= & roenving> hvad med mit forslag om at sætte en mega margin-bottom eller padding-bottom? det burde vel gøre det han vil have (sammen med height:100% på html og body).
Avatar billede mik789 Nybegynder
20. oktober 2003 - 10:23 #7
nak-m> men du må lige fortælle os hvad du skal have ind i den div.
Avatar billede nak-m Nybegynder
20. oktober 2003 - 14:50 #8
mik789: ikke noget specielt. ganske almindelig html :)

roenving: har prøvet det men det syntes ikke at påvirke diven i nogen  browser.

Skal siges at min div er absolute placeret.
Avatar billede nak-m Nybegynder
21. oktober 2003 - 00:46 #9
håber i kan finde ud af et eller andet :)
Avatar billede mik789 Nybegynder
21. oktober 2003 - 07:39 #10
læg koden eller et link
Avatar billede nak-m Nybegynder
21. oktober 2003 - 18:10 #11
Det er som sagt ganske simpelt. Jeg har en div med en css der fx siger:

position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100px;
Avatar billede roenving Novice
21. oktober 2003 - 21:16 #12
Dette virker perfekt for mig i IE6, i Mozilla følger de jo standarden, så div'en bliver ialt 6px for høj !-)

<style type="text/css">
html,body{height:100%;}
#main{
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100px;
background:#339900;
border:3px solid green;
}
</style>
<body>
<div id="main"></div>
</body>
Avatar billede roenving Novice
21. oktober 2003 - 21:17 #13
6px = 2*3px border ...
Avatar billede =maddog= Nybegynder
21. oktober 2003 - 22:59 #14
roenving> du skulle tage at putte URL i din doctype, ellers følger IE netop sin eget forkerte fortolkning af borders.
Avatar billede roenving Novice
21. oktober 2003 - 23:10 #15
Det var s*****, kan du så ikke fortælle mig hvad jeg gør galt med mine iframes på http://roenving.users.whitehat.dk/
Avatar billede =maddog= Nybegynder
21. oktober 2003 - 23:30 #16
nu ved jeg ikke lige hvad jeg skal kigge efter....
Avatar billede roenving Novice
21. oktober 2003 - 23:38 #17
Jeg kan ikke få bredden til at passe på både IE og Mozilla, for div/iframe i anden række har een border mere end der er i overskriften, så rammen for den div, som indeholder iframen er een pixel længere ude i Mozilla -- resten skulle jeg have check på !-)
Avatar billede nak-m Nybegynder
22. oktober 2003 - 13:17 #18
roenving: problemet er at det ikke længere duer hvis du fx smider en div der siger:

<div style="margin-left: 110px;">masser af tekst...</div>

kig selv efter hvis du tvivler :)
Avatar billede nak-m Nybegynder
23. oktober 2003 - 22:53 #19
jeg er vel ikke gået i glemmebogen? :)
Avatar billede roenving Novice
24. oktober 2003 - 01:25 #20
Hvad har du fået ud af at bruge de ideer, vi har givet ?-)
Avatar billede nak-m Nybegynder
25. oktober 2003 - 19:17 #21
Ingenting indtil videre :)
Har du selv fået noget til at virke med de metoder da?
Avatar billede nak-m Nybegynder
26. oktober 2003 - 00:01 #22
Det I har vist mig er, hvordan jeg kan sætte div'en til at fylde 100% af skærmens højde. Mens det jeg i virkeligheden vil have er, at få div'en til at fylde 100% af SIDENS højde. Og intet har nyttet indtil videre.

Jeg var rundt og lede på nettet efter en løsning. Der fik jeg den opfatning, at det måske var nødvendigt med javascript? Men er det ikke meget krævende?
Avatar billede roenving Novice
26. oktober 2003 - 07:52 #23
Ikke _meget_ krævende men voldsomt irriterende, hvis man kræver at det virker i mere end een browser ...
Avatar billede nak-m Nybegynder
26. oktober 2003 - 18:58 #24
Roenving:

Man kan vel bruge noget fra http://www.cross-browser.com/ til det, så kompatibilitet er nok ikke det store problem.

Hvad ville du foreslå som løsning? Skal jeg droppe at lave min side i divs, eller skal jeg snuppe et javascript?
Avatar billede nak-m Nybegynder
31. oktober 2003 - 00:11 #25
kan man finde en løsning?
Avatar billede nak-m Nybegynder
02. november 2003 - 12:09 #26
Og jeg spørger igen: er det mulighed for løsning eller skal jeg lukke?
Avatar billede nak-m Nybegynder
02. november 2003 - 12:10 #27
*det = der
Avatar billede nak-m Nybegynder
03. november 2003 - 12:39 #28
Så går der ikke lang tid, før jeg lukker og slukker! :)
Avatar billede nak-m Nybegynder
07. november 2003 - 08:59 #29
Så lukkes der, meine damen und herren!
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 18:50 Slet lokal konto Af ErikHg i Windows
I går 16:05 Ændre tal i en celle Af xvid i Excel
I går 13:47 Dette er ikke en kommerciel session i Windows 11 Af eksmojo i Windows
31/0810:26 Synkronisering af kalender mellem computer, android telefon og iPhone Af Strawberry i Andre onlineløsninger
31/0810:24 Kan Excel selv beregne alder? Af leahcim i Excel
White papers
Flere white papers »