Notifikationer

Markér alle som læst Log ud

ofirpeter Nybegynder

23. september 2004 - 19:16 Der er 23 kommentarer og
1 løsning

Problemer med height 100%

Hej, her har endnu engang brug for jeres værdifulde hjælp.
Jeg har i et stykke tid kæmpet med at lave en hjemmeside, som har en height på 100%, uden at gå fuldkommen i stykker.

Jeg søger et lille kode eksempel der kan vise mig hvordan dette problem kan løses, jeg har lavet et lille eksempel, for at vise hvad jeg mener:

www.ofirpeter.1go.dk/
(Da det er 1go, kan der ikke trykkes på linket, men det må kopieres op i adressebaren)

Det jeg ønsker er at den grønne menu, går helt ned til bunden, uanset opløsning, lige ledes skal "Denne tekst..." i bunden, hele tiden befinde sig i bunden af siden.

Alt dette skal må ikke berøre det røde felt (toppen) den må altså ikke blive strukket ud.

/Peter

Synes godt om

trekkies Juniormester

23. september 2004 - 19:18 #1

Du skal sætte en height="100%" ind i din tabel

Synes godt om

ofirpeter Nybegynder

23. september 2004 - 19:30 #2

Ja bare det var så simpelt. Men det ser således ud:
http://www.ofirpeter.1go.dk/index2.php

Synes godt om

trekkies Juniormester

23. september 2004 - 19:32 #3

Det er ikke den tabel, men den første tabel du har

Synes godt om

ofirpeter Nybegynder

23. september 2004 - 19:41 #4

Ja så går det først helt galt.
http://www.ofirpeter.1go.dk/index3.php

Synes godt om

trekkies Juniormester

23. september 2004 - 19:46 #5

Min fejl.

Du skal ændre lidt i din kode.
<body>


<table height="100%">
<tr>
<td>



</td>
</tr>
<table>

</body>

Synes godt om

ofirpeter Nybegynder

23. september 2004 - 20:01 #6

Hved ikke helt hvad der sker nu:
http://www.ofirpeter.1go.dk/index4.php

Synes godt om

knudgert Nybegynder

23. september 2004 - 20:06 #7

<table height="100%">

Nej - nej og nej - er ikke valid html!
Søg på nogle tidl. indlæg om, hvordan man gør det, roenving har besvaret det mange gange.

Synes godt om

ofirpeter Nybegynder

23. september 2004 - 20:28 #8

Nu har jeg fundet en besvarelse fra roenving, men kan stadig ikke få den hvide box på denne side http://www.ofirpeter.1go.dk/index5.php, til at gå ned til kanten af siden

Synes godt om

roenving Novice

24. september 2004 - 02:24 #9

Du kan jo prøve at kigge på dette eksempel:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 strict//EN"
"http://www.w3.org/TR/html401/strict.dtd">
<html>
<head>
<title>Fuld højde simpelt</title>
<meta name="Generator" content="Stone's WebWriter 4">
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/497362">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;}
#banner{position:absolute;height:125px;width:100%;background:yellow;z-index:1;}
#top1{width:100%;height:50px;background:#770;}
#top2{width:100%;height:75px;background:#707;}
#main{height:100%;background:green;}
#spacer{height:120px;}
#bottom{position:absolute;bottom:0px;height:125px;width:100%;background:yellow;z-index:1;}
#bund1{width:100%;height:25px;background:#770;}
#bund2{width:100%;height:100px;background:#707;}
</style>
</head>
<body>
<div id="banner">
<div id="top1">top1</div>
<div id="top2">top2</div>
</div>
<div id="main">
<div id="spacer">Usynligt</div>
Hovedside</div>
<div id="bottom">
<div id="bund1">bund1</div>
<div id="bund2">bund2</div>
</div>
</body>
</html>

Synes godt om

ofirpeter Nybegynder

24. september 2004 - 17:41 #10

Så kom guden til. Det kan godt være det er mig der ikke er helt skarb, men nu har jeg rygget forgæves rundt hele eftermiddagen, og kan simpelthen ikke til at bestå af de to bjælker og en bund.

Synes godt om

roenving Novice

25. september 2004 - 09:24 #11

Sådan, måske ?-)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 strict//EN"
"http://www.w3.org/TR/html401/strict.dtd">
<html>
<head>
<title>Fuld højde simpelt</title>
<meta name="Generator" content="Stone's WebWriter 4">
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/497362">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;}
#banner{position:absolute;height:125px;width:100%;background:yellow;z-index:1;}
#top{width:100%;height:125px;background:#770;}
#menu{height:100%;background:#aaf;width:120px;float:left;}
#main{height:100%;background:green;}
#spacer{height:125px;}
#bottom{position:absolute;bottom:0px;height:25px;width:100%;background:yellow;z-index:1;}
#bund{width:100%;height:25px;background:#ff7;}
</style>
</head>
<body>
<div id="banner">
<div id="top">top</div>
</div>
<div id="main">
<div id="menu">
<div id="spacer">Usynligt</div>
Menu</div>
<div id="spacer">Usynligt</div>
Hovedside</div>
<div id="bottom">
<div id="bund">Denne tekst skal stå helt i bund</div>
</div>
</body>
</html>

Synes godt om

rhandersen Nybegynder

25. september 2004 - 09:29 #12

//Sæt dette ind

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body margin:0px;>

<table width="684" border="0" cellpadding="0" cellspacing="0" bgcolor="#993366" height="100%">

<tr>
<td width="684" height="82" valign="top"><strong><font color="#FFFFFF">Top</font></strong></td>
</tr>
</table>
<table width="684" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">

<tr>
<td width="159" height="530" valign="top">
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#99CCCC">

<tr>
<td width="159" height="530" valign="top"><strong>Menu</strong></td>
</tr>
</table></td>
<td width="525" valign="top" bgcolor="#FFFFFF"><p><strong>Indhold</strong><br>
Velkommen til min hjemmesde.</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p align="center">Denne tekst skal hele tiden være placeret i bunden
af skærmen</p>
</td>
</tr>
</table>
</body>
</html>

Synes godt om

roenving Novice

25. september 2004 - 09:47 #13

?-)

Det er da endnu værre end ofirpeters egne forsøg ...

-- og det både i IE og i Mozilla ...

Synes godt om

ofirpeter Nybegynder

26. september 2004 - 12:20 #14

Nu er det ved at være rigtig godt! Oplever dog en lidt dum fejl, når jeg gør vinduet mindre horisontalt, så forsvindet teksten, hvis jeg minimere ind over den.

Jeg har gjort således:

css:
/* STARTSIDE */
html,body{height:100%;margin:0px;padding:0px;}
#banner{position:absolute;height:190px;width:100%;z-index:1;}
#top{width:100%;height:190px;}
#menu{height:100%;background:#8FBEE8;width:167px;float:left;}
#main{height:100%;}
#spacer{height:198px;}
#spacer2{height:198px;}
#bottom{position:absolute;bottom:0px;height:25px;width:770px;z-index:1;}
#bund{width:770px;height:25px;}

html:

<?php require("sql.php"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 strict//EN" "http://www.w3.org/TR/html401/strict.dtd">
<html>
<head>
<title>hardudetgodt.dk</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="../text.css" rel="stylesheet" type="text/css">
</head>
<body>

<div id="banner">
<div id="top">
<?php require('top.php'); ?>
</div>
</div>
<div id="main">
<div id="menu">
<div id="spacer">Usynligt</div>
<?php require('menu.php'); ?></div>
<div id="spacer2">Usynligt</div>
<?php require('start.php'); ?></div>
<div id="bottom">
<div id="bund">
<?php require('bund.php'); ?>
</div>
</div>
</body>
</html>

I de forskellige require, ligger der tekst og tabeller.

Synes godt om

ofirpeter Nybegynder

26. september 2004 - 12:30 #15

I kan se et eks. her: http://www.ofirpeter.1go.dk/index8

Synes godt om

roenving Novice

26. september 2004 - 12:32 #16

Den kan jeg ikke gennemskue udfra den kode ...

-- men jeg vil da lige gøre opmærksom på, at man skal bruge klasser, hvis flere elementer skal have de samme egenskaber, så i stedet for

#spacer{height:198px;}
#spacer2{height:198px;}

og

<div id="spacer">Usynligt</div>
<?php require('menu.php'); ?></div>
<div id="spacer2">Usynligt</div>

skal du:

.spacer{height:198px;}

og

<div class="spacer">Usynligt</div>
<?php require('menu.php'); ?></div>
<div class="spacer">Usynligt</div>

Synes godt om

roenving Novice

26. september 2004 - 12:36 #17

Den forsvinder jo ikke, men der er jo ikke plads til main-diven i bredden, når du minimerer, så den rykker selvfølgelig nedenunder, hvilket jo også ses tydeligt på scrollbaren, som kommer frem !-)

Synes godt om

ofirpeter Nybegynder

26. september 2004 - 13:22 #18

Nåh :) Klasser er svaret, w3 brokkede sig over de ens id, derfor ændrede jeg navnene.

Hvordan sørger jeg for at den og finder ud af hvor stor den er i breden, og nu har jeg lige opdaget at den også brokker sig hvis jeg skriver mere tekst end der kan være ikke billedet? http://www.ofirpeter.1go.dk/index8.php

Synes godt om

ofirpeter Nybegynder

28. september 2004 - 16:26 #19

Roenving? :)

Synes godt om

ofirpeter Nybegynder

29. september 2004 - 17:53 #20

Jeg har nu oprettet et nyt sprøgsmål i javascript kategorien (http://www.eksperten.dk/spm/545155), da jeg mener det er det vi skal have fat i for at løse mit næste problem. Du må meget gerne svare roenving.

Synes godt om

roenving Novice

30. september 2004 - 12:15 #21

Oki '-)

Synes godt om

ofirpeter Nybegynder

30. september 2004 - 12:20 #22

Tak for hjælpen. Har på fornemmelsen du har evnerne til at løse mit nye sprøgsmål, så du må meget gerne kigge forbi. :)

Synes godt om

roenving Novice

30. september 2004 - 13:02 #23

Tak for point ;~}

-- og idag har jeg ikke lige tid, men nu har jeg registreret mig på det, og umiddelbart tror jeg det vil kræve noget irriterende tricky kode !-)

Synes godt om

ofirpeter Nybegynder

30. september 2004 - 13:05 #24

Det var det jeg tænkte! "Ham roenving, han har det for nemt" ;0) Det kunne være rigtigt lækkert hvis du gad kigge på det, på et tidspunkt, mine evner strækker sig ikke så langt ( Har jeg opdaget :)

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

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.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS