Toon posts:

]CSS

Pagina: 1
Acties:
  • 77 views sinds 30-01-2008

Verwijderd

Topicstarter
Ik zit met een probleem waar ik al dagen mee aan het klooien ben. De oplossing zal ongetwijfeld simpel zijn, maar ik kom er maar niet uit.
Eerst maar eens de bijbehorende code:
Cascading Stylesheet:
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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
#html, body {
    padding: 0px;
    margin: 0px;
    height: 100%;
    font: 11px "trebuchet ms";
    color: #303840;
    background: #515159;
}

#container {
    position: absolute;
    padding-top: 26px;
    padding-bottom: 10px;
    margin-left: -383px;
    top: 0px;
    left: 50%;
    height: 100%;
    width: 766px;
    -moz-box-sizing: padding-box;
}

#top {
    position: absolute;
    top: 0px;
    height: 26px;
    width: 100%;
    background: url("../images/menu_bg.gif") no-repeat;
}

#header {
    position: absolute;
    top: 26px;
    height: 213px;
    width: 100%;
    background: url("../images/header.gif") no-repeat;
}

#main {
    position: absolute;
    left: 0px;
    height: 100%;
    top: 239px;
    width: 589px;
    background: #FCFCFD;
    overflow: auto;
}

#maincontent {
    padding-left: 25px;
    padding-right: 25px;
}

#right {
    position: absolute;
    top: 239px;
    right: 0px;
    height: 100%;
    width: 177px;
    background: transparent url("../images/submenu_bg.gif") repeat-y;
}

#rightcontent {
    padding-left: 11px;
    padding-right: 11px;
    padding-top: 16px;
}

#bottom {
    position: absolute;
    bottom: 0px;
    height: 10px;
    width: 100%;
    font-size: 1px;
    background: #EF4135;
}
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
33
34
35
36
37
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//golem.ph.utexas.edu//DTD XHTML 1.1 plus Target 1.0//EN" "http://golem.ph.utexas.edu/DTD/xhtml11-target.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="nl" >

<head>
<title>Bla</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
<meta http-equiv="content-language" content="nl" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="imagetoolbar" content="false" />
<style type="text/css" media="all">
    @import "css/common.css";
</style>
<script type="text/javascript" src="js/common.js"></script>
</head>

<body>
<div id="container">
    <div id="top">
    Bla menu
    </div>
    <div id="header"></div>
    <div id="main">
        <div id="maincontent">
        Bla main
        </div>
    </div>
    <div id="right">
        <div id="rightcontent">
        Bla rechts
        </div>
    </div>
    <div id="bottom"></div>
</div>
</body>

</html>
Het probleem is dat de 'main' en de 'right' div's dusdanig uitrekken, dat ze nog tot onder de 'bottom' div reiken. De pagina lijkt goed op het eerste gezicht, ware het niet dat er rechts nog een scrollbar zit i.v.m. die uitrekkende div's.

Iemand enig idee wat ik fout doe? Ik ben het spoor bijster. :/

Verwijderd

Topicstarter
Oeps, mag op slot. |:(

Dank.

  • curry684
  • Registratie: Juni 2000
  • Laatst online: 14:03

curry684

left part of the evil twins

Dubbel ;)

Professionele website nodig?


Dit topic is gesloten.