Avatar billede Keld Nielsen Professor
06. oktober 2005 - 22:02 Der er 3 kommentarer og
1 løsning

Scrollen går op under toppen - Div-side

Jeg har "lånt" noget kode her fra sitet, som jeg har brygget lidt videre på.
Mit problem er at scrollen går op under toppen, jeg synes jeg har forsøgt med alle kombination af absolute og relative, men kan ikke se fejlen.

Håber een af jer kan.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 strict//EN"
    "http://www.w3.org/TR/html401/strict.dtd">
<html>
<head>
<title>Fuld højde centreret simpelt</title>
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/520876">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;text-align:center;}
#container{position:relative;height:100%;width:770px;margin:0px auto;text-align:left;}
#banner{position:absolute;height:125px;width:100%;background:yellow;z-index:1;}
#main{height:100%;background:green;}
#indhold{height:100%;background:red;overflow:-moz-scrollbars-vertical;overflow-x:hidden;overflow-y:scroll;
}
#spacer{position:relative;height:125px;}
</style>
</head>
<body>
<div id="container">
    <div id="banner">
    </div>
  <div id="main">
      <div id="spacer">Usynligt</div>
    <div id="indhold">
      <p>Lorem ipsum dolor sit amet, vel vestibulum eget sollicitudin vitae, </p>
      <p>aliquam amet sit non tortor, est egestas scelerisque,</p>
      <p> augue varius sollicitudin. Mauris sodales. </p>
      <p>Venenatis lacus et a et etiam urna, etiam vestibulum eget. </p>
      <p>Proin lacinia sollicitudin consectetuer risus. </p>
      <p>Porttitor mi dolor.</p>
      <p> Laoreet mi eu facilisis laoreet massa, feugiat mollis dis.</p>
      <p> In commodo ut libero lacus, vel venenatis tempor eget nec. </p>
      <p>Sed vivamus fringilla urna, purus magnis, interdum vulputate in ligula volutpat, viverra condimentum risus ac ullamcorper eu sapien, diam in duis congue vulputate id pede. </p>
      <p>Adipiscing ligula, scelerisque ipsum donec sapien ipsam vel consectetuer, nonummy nam quisque lorem, magna incidunt suspendisse et mauris. </p>
      <p>Libero sed nam parturient, nam ipsum. </p>
      <p>Aliquam nec ultricies maecenas felis natoque cras, ligula amet scelerisque.</p>
      <p>Turpis elementum est, in mi in, ullamcorper ut nec. Gravida eleifend tempor labore nunc at aliquam, ut at nulla fermentum, cum ullamcorper wisi. Fusce sit dolor nisl, vivamus est urna, ac tellus pellentesque nulla arcu, vitae elementum risus eleifend sem libero dolor, duis sociosqu non. Ac per eu quia semper. Ullam velit curabitur id vestibulum. Iaculis aliquam eu sapiente, sit vivamus viverra vel eget eros amet, potenti pretium eros aenean eu vestibulum, est vestibulum libero justo at dui. Cum commodo consequat, aptent molestie. Primis vel, feugiat tincidunt, vel arcu maecenas imperdiet gravida ipsum eget, magna vitae cras libero adipiscing, et vitae a velit dui. Nec vehicula fringilla fermentum et turpis, massa diam, sed viverra mi est, pulvinar amet mattis mauris dolor. Massa sed et mattis non, interdum suscipit.<br>
      </p>
    </div>
  </div>
</div>
</body>
</html>
Avatar billede olebole Juniormester
07. oktober 2005 - 03:04 #1
<ole>

yups - alt er, som du beder om:
  #main{height:100%;background:green;}
100% af det omkransende elements højde - og banneret lægger sig pænt foran  ;o)

Du kan ikke med CSS sætte et element til 100%-125px  :o|

/mvh
</bole>
Avatar billede Keld Nielsen Professor
05. november 2005 - 15:49 #2
olebole, smid bare et svar  ...droppede idéen og gik tilbage til det kendte, frameset, selvom det bliver hakket ned.
Avatar billede olebole Juniormester
06. november 2005 - 09:07 #3
njahhh ... ellers tak. Læg du bare et selv og accepter det. Vi mødes nok over lidt mere substans i et andet spm - men tak for tanken  ;o)
Avatar billede Keld Nielsen Professor
06. november 2005 - 10:10 #4
Jamen tak for indlægget 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
Vi tilbyder markedets bedste kurser inden for webudvikling

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