Hallo allemaal,
Ik ben een website aan het maken, waarbij ik met CSS een lay-out probeer te maken, bestaande uit 2 kolommen naast elkaar. De linker kolom moet vervolgens onderverdeeld worden in 3 vakken, waarbij het onderste vak weer wordt opgedeeld in 3 vakken. Van deze 3 vakken hebben het onderste en het bovenste vak een vaste hoogte van 10px en de hoogte van het middelste vak moet afhangen van de hoeveelheid tekst.
Dit gaat bijna helemaal goed, met uitzondering van de hoogte van de 2 vakken van 10px. In IE zijn deze vakken namelijk niet 10 pixels, maar 19 pixels hoog. In FF is de hoogte wel 10 pixels.
Heeft iemand een oplossing voor dit probleem?
Met vriendelijke groeten,
Sander
De CSS-code ziet er als volgt uit:
Ik ben een website aan het maken, waarbij ik met CSS een lay-out probeer te maken, bestaande uit 2 kolommen naast elkaar. De linker kolom moet vervolgens onderverdeeld worden in 3 vakken, waarbij het onderste vak weer wordt opgedeeld in 3 vakken. Van deze 3 vakken hebben het onderste en het bovenste vak een vaste hoogte van 10px en de hoogte van het middelste vak moet afhangen van de hoeveelheid tekst.
Dit gaat bijna helemaal goed, met uitzondering van de hoogte van de 2 vakken van 10px. In IE zijn deze vakken namelijk niet 10 pixels, maar 19 pixels hoog. In FF is de hoogte wel 10 pixels.
Heeft iemand een oplossing voor dit probleem?
Met vriendelijke groeten,
Sander
De CSS-code ziet er als volgt uit:
code:
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
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
| body {
text-align:center;
margin:0px;
padding:0px;
background-color: #F0EEE8;
}
#container {
width: 784px;
height: auto;
margin: 0px auto;
padding: 0px;
background-color: #F0EEE8;
}
#vaklinks {
float: left;
margin: 4px 0px 0px 0px;
padding: 0px;
width: 565px;
height: auto;
background-color: #FF7700;
text-align: left;
}
#vaklinksboven {
margin: 0px;
padding: 0px;
width: 565px;
height: 245px;
background-color: #FFFF88;
text-align: left;
}
#vaklinksonder {
margin: 0px;
padding: 0px;
width: 565px;
height: auto;
background-color: #F07782;
text-align: left;
}
#vakbovenhoofdvak {
margin: 0px;
padding: 0px;
width: 565px;
height: 10px;
background-color: #8811BB;
}
#vakmiddenhoofdvak {
margin: 0px;
padding: 0px;
width: 565px;
height: auto;
background-color: #875216;
text-align: left;
}
#vakonderhoofdvak {
margin: 0px;
padding: 0px;
width: 565px;
height: 10px;
background-color: #811119;
text-align: left;
}
#vakrechts {
float: right;
margin: 4px 0px 0px 0px;
padding: 0px;
width: 219px;
height: 50px;
background-color: #FF3300;
}
#vakrechtsboven {
margin: 0px;
padding: 0px;
width: 219px;
height: 317px;
background-color: #FF7631;
text-align: left;
}
#vakrechtsonder {
margin: 0px;
padding: 0px;
width: 219px;
height: auto;
background-color: #F06231;
text-align: left;
}
menu {
list-style-type: none;
padding: 0px;
margin: 0px;
width: 565px;
height: 72px;
text-align: left;
background-color: #FFFFFF;
} |