Hai,
Zoals je HIER kan zien staat er links van het menu een lijn schaduw. Deze lijn zou zich over de gehele lengte moeten uitstrekken, maar doet dit niet. De lijn staat als achtergrondafbeelding in de div 'menuwrapper'. Ik kan de div wel rekken met pixelwaardes, maar dat is niet echt optimaal natuurlijk, aangezien hij dan de lengte van de langste pagina moet hebben of een andere ID op elke pagina.
De body staat op 100%, de wrapper waar de div instaat ook, en de div zelf ook. Ik veronderstel dat ik iets fout doe met de positions, maar ik heb geen idee wat.
Alvast heel erg bedankt
Michael
CSS:
Code:
body {
font-family: Helvetica, Arial, sans-serif;
font-size: 0.9em;
margin: 0px;
height:100%;
}
p {
line-height: 1.5em;
font-family: Georgia, "Times New Roman", Times, serif;
font-size:14px;
}
h1 {
color: #39b54a;
font-size:24px;
font-family:"Times New Roman", Times, serif;
font-style: normal;
font-weight: lighter;
}
h2 {
color: #000000;
font-size:24px;
font-family:"Times New Roman", Times, serif;
font-style: normal;
font-weight: lighter;
}
h3 {
color: #000000;
font-size:14px;
font-family:"Times New Roman", Times, serif;
font-style: oblique;
font-weight: bold;
vertical-align:top;
}
table {
color: #000000;
font-size:14px;
font-family: Georgia, "Times New Roman", Times, serif; font-style: normal;
font-weight: lighter;
vertical-align: top;
}
td {
padding: 5px;
vertical-align: top;
}
ul.menu, ul.menu ul {
list-style-type:none;
margin-left: 20px;
padding-left: 0;
width: 15em;
}
ul.menu a {
display: block;
text-decoration: none;
}
ul.menu li {
margin-top: 1px;
}
ul.menu li a {
color: #464646;
padding: 0.25em;
border-width: 2px;
border-bottom-style: solid;
border-color: #f9f9f9;
}
ul.menu li a:hover {
font-weight: bold;
}
ul.menu li ul li a {
color: #2d2d2d;
font-size: 0.7em;
padding-left: 20px;
border-bottom: 0px;
}
ul.menu li ul li a:hover {
padding-left: 15px;
}
.ortho a:hover {
padding-left: 15px;
border-left: 5px #39b54a solid;
}
.esthm a:hover {
padding-left: 15px;
border-left: 5px #6cccf8 solid;
}
.esthv a:hover {
padding-left: 15px;
border-left: 5px #f699f5 solid;
}
.onco a:hover {
padding-left: 15px;
border-left: 5px #b80000 solid;
}
.preproth a:hover {
padding-left: 15px;
border-left: 5px #4d97ff solid;
}
.wrapper{
margin: 0 auto;
width: 1000px;
height: 100%;
}
.menuwrapper {
position:relative;
width: 200px;
height: 100%;
float:left;
padding-top: 165px;
background-color:#ffffff;
background-image:url(images/shadowline.jpg);
background-repeat:repeat-y;
z-index:0
}
.contentwrapper {
position:relative;
display:inline;
margin-top: 0px;
width: 800px;
height: 100%;
float:left;
background-image:url(images/bg.jpg);
background-repeat: no-repeat;
background-position:top;
background-color: #f5f5f5;
z-index:1;
border-top: 5px #ededed solid;;
}
.contentwrapper-ortho {
position:relative;
display:inline;
margin-top: 0px;
width: 800px;
height: 100%;
float:left;
background-image:url(images/ortho-bg.jpg);
background-repeat: no-repeat;
background-position:top;
background-color: #f5f5f5;
z-index:1;
border-top: 5px #39b54a solid;
}
.contentwrapperesth {
position:relative;
display:inline;
margin-top: 0px;
width: 800px;
height: 100%;
float:left;
background-image:url(images/esth-bg.jpg);
background-repeat: no-repeat;
background-position:top;
background-color: #f5f5f5;
z-index:1;
border-top: 5px #ffe300 solid;
}
.contentwrapperonco {
position:relative;
display:inline;
margin-top: 0px;
width: 800px;
height: 100%;
float:left;
background-image:url(images/onco-bg.jpg);
background-repeat: no-repeat;
background-position:top;
border-top: 5px #4d97ff solid;
z-index:1;
}
.contentwrapperpreproth {
position:relative;
display:inline;
margin-top: 0px;
width: 800px;
height: 100%;
float:left;
background-image:url(images/preproth-bg.jpg);
background-repeat: no-repeat;
background-position:top;
border-top: 5px #b80000 solid;
z-index:1;
}
.textwrapper {
margin-top: 350px;
margin-left: 40px;
margin-right: 65px;
}
.disclaimer {
font-family: Arial, Helvetica, sans-serif;
font-size: 9px;
text-align: right;
padding-top: 8px;
background-color: #ffffff;
}
.pagename {
margin-top: 130px;
margin-left: 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
color: #cccccc;
clear: none;
font-weight: lighter;
position: absolute;
top: 515px;
z-index: 1;
}
.code { border: 1px solid #ccc; list-style-type: decimal-leading-zero; padding: 5px; margin: 0; }
.code code { display: block; padding: 3px; margin-bottom: 0; }
.code li { background: #ddd; border: 1px solid #ccc; margin: 0 0 2px 2.2em; }
.indent1 { padding-left: 1em; }
.indent2 { padding-left: 2em; }