Søg
Avatar billede Slettet bruger
24. august 2004 - 15:27 Der er 16 kommentarer og
1 løsning

Undgå scroll på side med div på 100%

Hej!

Hvordan undgår jeg scroll i højre side i dette dokument? Den scrollbar der er i min <div> skal være den eneste der er der.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
    <title>Untitled</title>
   
<style>

html,body {
margin:0px;
height:100%;
}

</style>
   
</head>

<body>

<div style="position:absolute;top:30px;bottom:0px;height:100%;width:200px;overflow:auto">
kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj kjhkhkjh kjh kj kjh kjh kj kjh kj kj
</div>
</body>
</html>
Avatar billede roenving Novice
24. august 2004 - 15:33 #1
Ved at sætte en ghost ind i, som fylder de første 30px;

<div style="position:absolute;top:0px;bottom:0px;height:100%;width:200px;overflow:auto">
<div style="position:relative;height:30px;"></div>

tekst

</div>
Avatar billede Slettet bruger
24. august 2004 - 15:36 #2
Ja..men..det som jeg gerne vil er at indsætte noget øverst, der hvor de 30 pixels topafstand er.

Det drejer sig mere specifikt om 4 knapper.
Avatar billede roenving Novice
24. august 2004 - 15:41 #3
Det sætter du så blot ind i den div !-)
Avatar billede Slettet bruger
24. august 2004 - 15:42 #4
Jamen de skal ikke scrolle med ned :)
Avatar billede roenving Novice
24. august 2004 - 15:48 #5
<div style="position:absolute;height:30px;">Dine knapper</div>
<div style="position:absolute;top:0px;bottom:0px;height:100%;width:200px;overflow:auto;z-index:-1">
<div style="position:relative;height:30px;"></div>

tekst

</div>
Avatar billede Slettet bruger
24. august 2004 - 15:52 #6
Hmmm...nu kan jeg ikke bruge scrollbaren i IE, og i Mozilla er al teksten + scrollbar væk :/
Avatar billede Slettet bruger
24. august 2004 - 15:53 #7
Og det ville være rart at scrollbaren først starter de 30px nede, da knapperne er en del af et design, og scrollbaren passer ikke rigtig ind i det
Avatar billede roenving Novice
24. august 2004 - 15:59 #8
<div style="position:absolute;height:30px;z-index:10;background:white;width:200px;">Dine knapper</div>
<div style="position:absolute;top:0px;bottom:0px;height:100%;width:200px;overflow:auto;z-index:5;">
<div style="position:relative;height:30px;z-index:1;"></div>

-- så vil de øverste 30px af scrollbaren være skjult, men alternativet er at beregne sig frem til en anderledes størrelse for din div !-)
Avatar billede Slettet bruger
24. august 2004 - 16:08 #9
Hmmm..øv bøv..

Det er nok ikke en holdbar løsning :/
Avatar billede Slettet bruger
24. august 2004 - 16:34 #10
Måske har jeg fundet en løsning:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
    <title>Untitled</title>
   
<style>

html,body {
margin:0px;
height:100%;
}

</style>
   
</head>

<body style="overflow:hidden">
<div style="position:relative;height:40px;">knapper</div>
<div style="width:200px;padding-top:50px;background:red;height:100%">
<div style="overflow:scroll;position:relative;bottom:70px;height:100%;background:blue">hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj </div>
</div>
</body>
</html>
Avatar billede syvon Nybegynder
24. august 2004 - 22:04 #11
Så har du jo stadig din scroll i højre side prøv dette istedet

<style type="text/css">

html,body {
margin:0px;
height:100%;
overflow:hidden;
}

</style>

og fjern style="overflow:hidden;" i dit <Body> tag
Avatar billede Slettet bruger
24. august 2004 - 22:27 #12
Kan du ikke prøve lige at poste hele koden?

Mine knapper i toppen af siden er 25px høje, men jeg synes ikke de kan være der i højden...
Avatar billede syvon Nybegynder
24. august 2004 - 22:33 #13
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
    <title>Untitled</title>
   
<meta name="Generator" content="Stone's WebWriter 4">
<style type="text/css">

html,body {
margin:0px;
height:100%;
overflow:hidden;
}

</style>
   
</head>

<body>
<div style="position:relative;height:40px;">knapper</div>
<div style="width:200px;padding-top:50px;background:red;height:100%">
<div style="overflow:scroll;position:relative;bottom:70px;height:100%;background:blue">hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj </div>
</div>
</body>
</html>
Avatar billede syvon Nybegynder
24. august 2004 - 23:22 #14
har rettet lidt

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
    <title>Untitled</title>
   
<meta name="Generator" content="Stone's WebWriter 4">
<style type="text/css">

html,body {
margin:0px;
height:100%;
overflow:hidden;
}

</style>
   
</head>

<body>
<div style="position:relative;height:30px;">knapper</div>
<div style="width:200px;background:red;height:100%;">
<div style="overflow:scroll;position:relative;height:100%;background:blue">hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj hkjhkjhk jhkjh kjh kjh kjhkj k kj </div>
</div>
<div style="position:relative;height:30px;"></div>

</body>
</html>
Avatar billede Slettet bruger
25. august 2004 - 11:56 #15
Nu forsvinder den nederste pil i scrollbaren. Jeg finder en løsning med iframes, men du må gerne lægge et svar for din indsats :)
Avatar billede syvon Nybegynder
25. august 2004 - 12:20 #16
her er et svar :)

Men ellers så er det bare at lave om på højden på den nederste div
Avatar billede Slettet bruger
25. august 2004 - 12:22 #17
oki, men tak alligevel
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 dag 09:36 Alternativ holder til to skærme... Af Don G i Skærme
20/0815:01 Samsung smart TV Af postpeter@outlook.dk i Fri debat
20/0814:16 installere windows på separat diskpartition Af Malm i Windows
20/0813:43 Problem med mcafee Af Malm i Andet software
20/0813:39 Er tilstrækkelig antivirus incl på ny Samsung smartphone ? Af annam i Backup- & Antivirus
White papers
Flere white papers »