Sida 1 av 1

Scrollbar & utfyllning av div i CSS

Postat: 19 aug 2007, 18:07
av koch
Här är en dålig förklaring på vad jag vill göra:

"istället för att skriva height och istället för en massa <br> så "fyller man ut" diven med mellanrum tills den blir lika stor som skärmen(-40px i margin) så att sidan inte ser fuckad ut. Om det skulle finnas mer text på sidan så skulle där vara en rullningslist i den istället för att den skulle bli större än skärmen"

Här är en bild, det kanske blir lättare att förstå: http://img488.imageshack.us/img488/8624/fyllautox7.jpg

Om detta inte hjälper kanske denna hemsidan hjälper: http://www.pagen.se, jag vill göra något liknade med "main diven". Så att om jag ändrar storlek på fönstret eller upplösning på skärmen så ändras diven, då blir det omöjligt att rulla hemsidan (vilket jag vill), utan man rullar bara själva texten i main diven.


Om det var någon som förstod vad jag menade som vet vad jag ska göra skriv det, om någon förstod det och vet hur man kan förklara det bättre skriv det gärna :) Tack :D

SV: Scrollbar & utfyllning av div i CSS

Postat: 09 sep 2007, 02:45
av HOLMEN
Kan du inte testa att använda procent istället för fasta storlekar. Som 80% av main div ska visas på skärmen. Då kommer ju denna div att ändras iochmed användarens skärmstorlek. Jag är aning trött nu och jag kan ha fel men det ska väl gå att göra såhär tex:

Kod: Markera allt

#main {
	 margin : 0 auto; 
	 width : 80%;
	 height : 80%;
}

SV: Scrollbar & utfyllning av div i CSS

Postat: 09 sep 2007, 13:26
av DrMegahertz
Hmm.. Lite knepigt att förstå vad du vill uppnå.. Men kanske är det `overflow: auto;` som du söker.

Exempel:

Kod: Markera allt

<html>
  <head>
    <style type="text/css">
      div#content {
        height: 100px;
        overflow: auto;
        width: 25%;
      }
    </style>
  </head>
  <body>
    <div id="content">
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum sit amet libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer aliquet augue sit amet nisi. Donec eu magna. Donec tincidunt consequat turpis. Phasellus vitae nunc. Nunc ut lorem. Quisque imperdiet convallis pede. Quisque malesuada quam in leo. Nullam ut nibh at quam dignissim eleifend.</p>
    </div>
  </body>
</html>