[CSS+HTML] pagina wordt langer>scrollbalk nodig

Pagina: 1
Acties:
  • 124 views sinds 30-01-2008
  • Reageer

  • -Japser-
  • Registratie: Augustus 2005
  • Laatst online: 31-01-2024
Hallo,
Na op google me al helemaal suf gezocht te hebben, bedacht ik mijn vraag hier maar eens te stellen.

De opmaak van mijn site is in CSS gemaakt. Nu loopt op een paar pagina's de tekst door, waardoor er aan de linkerkant (een andere div) witte achtergrond verschijnt, zo lang als de tekst is in het middenvenster (main div). De oplossing is dus een scrollbalk op een paar pagina's van de main.

Maar, ik heb diverse plaatsen in de css geprobeerd, heb ook overflow:scroll geprobeerd, maar niks helpt. Weet iemand de oplossing?
Hier de CSS code van het main venster, dus waar de tekst te lang is en de scrollbalk moet:
code:
1
2
3
4
5
6
7
8
9
10
11
12
div.Main2{
   width: 562px;
   float: left;
   background-image: url(images/main2.gif);
}
div.MainInhoud2{
   overflow: scroll;
   height: 387px;
   width: 549px;
   text-align: justify;
   
}

  • DexterDee
  • Registratie: November 2004
  • Laatst online: 13-02 16:00

DexterDee

I doubt, therefore I might be

Ik denk even hardop hoor, maar was het niet zo dat je position: relative of position : absolute moest toevoegen om een div scrollable te maken?

Klik hier om mij een DM te sturen • 3245 WP op ZW


  • -Japser-
  • Registratie: Augustus 2005
  • Laatst online: 31-01-2024
DexterDee schreef op woensdag 09 augustus 2006 @ 14:23:
Ik denk even hardop hoor, maar was het niet zo dat je position: relative of position : absolute moest toevoegen om een div scrollable te maken?
Ik heb ze allebei (relative en position) uitgeprobeerd en onder divMain2 en divMainInhoud2 gezet. Er veranderd wel wat soms, maar haalt dan de website door elkaar, dus dit is niet de oplossing helaas.. :'(

  • remcotolsma
  • Registratie: December 2005
  • Laatst online: 09-10-2025
De CSS die je geeft werkt wel in FF, IE5, IE6...
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <style type="text/css">
      <!--
      div.Main2
      {
        width: 562px;
        float: left;
        background-image: url(images/main2.gif);
      }

      div.MainInhoud2
      {
        overflow: scroll;
        height: 387px;
        width: 549px;
        text-align: justify;
      }
      -->
    </style>
  </head>

  <body>
    <div class="Main2">
      <div class="MainInhoud2">
        <p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p>   
      </div>
    </div>
  </body>
</html>

Misschien dat je wat meer info kunt geven..

  • -Japser-
  • Registratie: Augustus 2005
  • Laatst online: 31-01-2024
Ok, zie
http://www.jasperleferink.nl/transpher/index2.php?page=3
en
http://www.jasperleferink.nl/transpher/index2.php?page=4

Aan de rechterkant zie je een strookje wit, en ik wil dat ie dus gewoon gaat scrollen daar....

  • remcotolsma
  • Registratie: December 2005
  • Laatst online: 09-10-2025
Ik zou eerst de (X)HTML en CSS 'ns goed bij langs gaan, door dat even valide te maken los je je problemen wel op denk ik...

http://jigsaw.w3.org/css-...r%2Findex2.php%3Fpage%3D4
http://validator.w3.org/c...index2.php%253Fpage%253D4

Cascading Stylesheet:
1
2
3
4
5
6
7
div.MainInhoud2{
   overflow: scroll;
    height: 387px;
    width: 549px; 
    text-align: justify;
    position: fixed;    
}


De 'text-align: justify;' wordt bij mij ook niet toegepast geloof ik...

  • faabman
  • Registratie: Januari 2001
  • Laatst online: 08-08-2024
Cascading Stylesheet:
1
2
3
4
5
div{
  display:block;
  height:xx;
  overflow:auto;
}

zijn de basisingredienten van een scrollable element
Je moet in je testcase wel even rekening houden met de hoofdlettergevoeligheid van CSS ;)

Op zoek naar een baan als Coldfusion webdeveloper? Mail me!


  • -Japser-
  • Registratie: Augustus 2005
  • Laatst online: 31-01-2024
Na een beetje pielen is het uiteindelijk gelukt. Ik zal kijken welke fouten er nog in zitten en proberen te verbeteren.
Alleen zou ik nu de tekst bij de scrollbalken niet helemaal tot daaraan door willen lopen, maar 10px daarvoor ofzo, ik heb van alles geprobeerd bij de 'width' maar dat helpt niet. Waarbij moet ik dan zitten?

(zie url)

  • OkkE
  • Registratie: Oktober 2000
  • Laatst online: 10-11-2025

OkkE

CSS influencer :+

Als je ook even zou kunnen vertellen wat je tijdens het "beetje pielen" gedaan hebt, dat maakt het wat nuttiger voor andere mensen als ze dit topic vinden in de search. :)

Voor je tweede probleem; een padding-right:10px; op de zelfde <div> als waar je overflow:auto; aan hangt, zou het moeten oplossen.

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

Pagina: 1