Scrollen

[arjandevries]

Nou, ik heb weer een (voor mij) onoplosbaar probleem.... Vast heel simpel...

Ik wil de kop + menubalk bovenaan de pagina laten. De rest moet scrollen als het nodig is! (overflow:auto)

Hier is de pagina: hij doet het mooi niet....http://www.entma.eu/cms/

Wie heeft het antwoord??

Bedankt.

Hier is de template:



{title}
{metadata}
{stylesheet}



 
     
     
     
               
                {if $ccuser->loggedin()}
                {cms_module module='menumanager' template='entma'}
                {else}
                {cms_module module='menumanager' template='entma' excludeprefix='private_'}
                {/if}
               
     
 

     
               
                  {content}
                 
       






Hier is de css:
html {
    margin-top:0px;
    margin-left:0;
    overflow:hidden;
}

body {
    width:100%;
    position:absolute;
    margin-top:0;
    margin-left:0;
    font-family: verdana, arial, helvetica, sans-serif;
    color: #000000;
    background-color: #E3E3E3;
}


#container {
position:fixed;
width: 100%;
display: inline;
}

#kop{
    position:absolute;
    margin-top:0;
    margin-left:0;
    width:100%;
    height:auto;
    overflow:hidden;
}

#topbalk {
height:30px;
background-color: #00747D;
}

#header {
      background-color:#FEC520;
      background-image: url(Uploads/images/logodef2.png);
      background-repeat: no-repeat;
      background-position: left top;
      height: 150px;

}

/* The wrapper clears the floating elements of the menu */

#menuwrapper {
       
        background-color: #00747D;
        width: 100%;
        font-size: .9em;
        margin-left: 0px;
        }

#contentcontainer{
      position:absolute;
      margin-top:210px;
     

}

#content {
margin:0;
font-size: .9em;
line-height: 1.8em;
overflow:scroll;

}

#content p {
text-align: justify;
margin-left: 40px;
margin-right: 60px;
}

/*text-opmaak*/


/*links in de content*/

#main-text a:link, a:visited {
color: #00616D;
font-family: "Trebuchet MS", Arial, Verdana;
text-decoration: underline;
font-weight: bold;
}

#main-text a:hover {
background-color:#00616D;
color: #ffffff;
text-decoration: none;
font-weight: bold;
}







/* Horizontal menu for the CMS CSS Menu Module */





/* Bepaal de breedte van de dropdown. Het hoofdmenu blijft flexibel. */

#primary-nav li li {
        width: 200px;

      }


/* Hier vanaf blijven!!!! */

#primary-nav, #primary-nav ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#primary-nav ul {
position: absolute;
top: auto;
display: none;
}
#primary-nav ul ul {
margin-top: 1px;
margin-left: -1px;
left: 100%;
top: 0px;
}

#primary-nav li {
margin-left: -1px;
float: left;
}
#primary-nav li li {
margin-left: 0px;
margin-top: -1px;
float: none;
position: relative;
}

/* Stijl van het verschijnen van de menuelementen */

/*de linkvorm*/
#primary-nav a {
       
display: block;
margin: 0px;
padding: 5px 10px;
text-decoration: none;
        color : #FEC520; /*hoofmenu letterkleur*/
        }

/*randje van het menu*/
#primary-nav li a {
border-right: 1px solid #FEC520;
border-left: 1px solid #FEC520;
color: #FEC520;
}


/*achergrondkleur hoofdmenu's met dropdown*/
#primary-nav li, #primary-nav li.menuparent{
background-color: #00747D;
color:green;
}


/* Styling the basic apperance of the active page elements (shows what page in the menu is being displayed) */

/*als een link actief is welke kleur*/
#primary-nav li.menuactive {
background-color: #7DBDB5;
color: green;
       
}


/* Styling the basic apperance of the menuparents - here styled the same on hover (fixes IE bug) */

/*de pijl bij een submenu van de dropdown*/
#primary-nav ul li.menuparent, #primary-nav ul li.menuparent:hover, #primary-nav ul li.menuparenth {
background-image: url(modules/MenuManager/images/arrow2.gif);
background-position: center right;
background-repeat: no-repeat;
}


/* hover stadium hoofdmenu */

#primary-nav li:hover, #primary-nav li.menuh, #primary-nav li.menuparenth, #primary-nav li.menuactiveh {
background-color:#7DBDB5;     
}



/* The magic - set to work for up to a 3 level menu, but can be increased unlimited */

#primary-nav ul, #primary-nav li:hover ul, #primary-nav li:hover ul ul,
#primary-nav li.menuparenth ul, #primary-nav li.menuparenth ul ul {
display: none;
          color: red;
}
#primary-nav li:hover ul, #primary-nav ul li:hover ul, #primary-nav ul ul li:hover ul,
#primary-nav li.menuparenth ul, #primary-nav ul li.menuparenth ul, #primary-nav ul ul li.menuparenth ul {
display: block;
}


/* IE Hacks */

#primary-nav li li {
float: left;
clear: both;
}
#primary-nav li li a {
height: 1%;
}

/*nog wat tekstopmaak*/

h1 {
margin-left:40px;
margin-right:60px;
color: #00616D;
font-family: "Trebuchet MS", Arial, Verdana;
font-size: 150%;
font-weight: bolder;
display: block;
border-bottom: 1px #00616D solid;}

h2 {
padding-bottom: 3px;
padding-right: 0;
color: #000000;
border-bottom: 1px #000000 solid;
letter-spacing: 5px;
margin-left: 50px;
margin-right: 50px;
font-size: 1em;
margin-top: 0;
padding-top: 10px;
}

p, ul, ol, table {
margin-top: 17px;
margin-bottom: 0;
}

ol, ul {
margin-left: 75px;
margin-right: 75px;
}

.tussenkopjes {
color:#00616D;
font-size: 120%;
font-family: "Trebuchet MS", Arial, Verdana;}

.titelvoorpagina
{
font-size:22px;
color: #FFCC00;
text-align:center;

}

.ondertitelvoorpagina
{
font-size:18px;
color: #FFCC00;
text-align:center;

}

.tweededetitelvoorpagina
{
font-size:22px;
color: #009999;
text-align:center;
}

.voorpaginagecentreerdetext
{

color: #FFCC00;
text-align:center;

}

.voorpaginalinkstext
{

color: #FFCC00;
text-align:left;

}
.voorpaginagecentreerdetextblauw
{

color: #009999;


}

.contenttitel {
color: #00616D;
font-family: "Trebuchet MS", Arial, Verdana;
font-size: 150%;
font-weight: bolder;
display: block;
border-bottom: 1px #00616D solid;}

[Jos]

Check de site CSS-Play eens. Daar staan verschillende voorbeelden die crossbrowser werken.

Ik ben zelf het meest gecharmeerd van http://www.cssplay.co.uk/layouts/body2.html omdat hier de verticale scrollbalk over de volle hoogte van het scherm zit