CSS
Code (php)
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
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
/* OPMAAK TEKST EN BODY */
body {
background: #cfcfcf;
color: #646464;
text-align: left;
font-family: Verdana, sans;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
}
a {
text-decoration: none;
color: #646464;
}
a:hover {
text-decoration: underline;
}
/* HEADER */
#header {
width: 430px;
height: 150px;
background-image: url('../images/header.jpg');
border: 2px solid #000000;
background-repeat: no-repeat;
color: #ffffff
}
#hr {
border: 1px;
color: #ffffff;
}
#millshot {
float: left;
padding-right: 40px;
}
#volgjemij {
float: right;
padding-left: 40px;
height: 25%;
width: 25%;
margin: 15px;
}
/* OPMAAK BLOKKEN */
#container {
background-color: #acacac;
width: 430px;
top: 17px;
float: right;
color: #646464;
position: relative;
text-align: left;
border: 2px solid #000000;
margin-top: 0px;
margin-right: 144px;
margin-left: 0px;
}
#menu {
width: 170px;
background-color: #acacac;
color: #000000;
border: 1px solid #000000;
margin-top: 40px;
margin-right: 0px;
margin-left: 45px;
float: left;
text-align: center;
}
body {
background: #cfcfcf;
color: #646464;
text-align: left;
font-family: Verdana, sans;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
}
a {
text-decoration: none;
color: #646464;
}
a:hover {
text-decoration: underline;
}
/* HEADER */
#header {
width: 430px;
height: 150px;
background-image: url('../images/header.jpg');
border: 2px solid #000000;
background-repeat: no-repeat;
color: #ffffff
}
#hr {
border: 1px;
color: #ffffff;
}
#millshot {
float: left;
padding-right: 40px;
}
#volgjemij {
float: right;
padding-left: 40px;
height: 25%;
width: 25%;
margin: 15px;
}
/* OPMAAK BLOKKEN */
#container {
background-color: #acacac;
width: 430px;
top: 17px;
float: right;
color: #646464;
position: relative;
text-align: left;
border: 2px solid #000000;
margin-top: 0px;
margin-right: 144px;
margin-left: 0px;
}
#menu {
width: 170px;
background-color: #acacac;
color: #000000;
border: 1px solid #000000;
margin-top: 40px;
margin-right: 0px;
margin-left: 45px;
float: left;
text-align: center;
}
en mijn HTML is:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<body>
<center><div id="header"> </div></center>
<div id="menu">
<a href="index2.htm">Home</a><br>
<a href="index2.htm">statistieken</a><br>
gastenboek beheer<br>
verslagen beheer<br>
</div><div id="container"> <p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </div>
<p> </p>
</body>
<center><div id="header"> </div></center>
<div id="menu">
<a href="index2.htm">Home</a><br>
<a href="index2.htm">statistieken</a><br>
gastenboek beheer<br>
verslagen beheer<br>
</div><div id="container"> <p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </div>
<p> </p>
</body>
en dus in IE lopen ze normaal naast elkaar maar in Firefox dus niet kan iemand helpen? Z.S.M alstublieft want dit is mijn stage opdracht:)
DIT IS DE GOEDE (van internet explorer):
http://img208.imageshack.us/img208/5261/iemb4.jpg
DIT IS DE FOUTE (van FIREFOX) deze moet netzo staan als die van IE:
http://img208.imageshack.us/img208/5343/ffmw1.jpg
oplossing: maar een container waar menu en body(heet bij jou nu container) inzitten. voor menu en body geen margins of padding gebruiken en wel float. en voor container mag je margins bij de lieve leed bebruiken
+-------------------------------------------------------------------------+
-+-----------+----------------------------------------------------------+-
-- - --
-- - --
-- - --
-- - --
-- - --
-- - --
-- - --
-+-----------+----------------------------------------------------------+-
+-------------------------------------------------------------------------+
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
#container {
background-color: #acacac;
width: 430px;
float: right;
color: #646464;
text-align: left;
border: 2px solid #000000;
margin-right: 144px;
margin-left: 0px;
}
#menu {
width: 170px;
background-color: #acacac;
color: #000000;
float: left;
border: 1px solid #000000;
text-align: center;
}
background-color: #acacac;
width: 430px;
float: right;
color: #646464;
text-align: left;
border: 2px solid #000000;
margin-right: 144px;
margin-left: 0px;
}
#menu {
width: 170px;
background-color: #acacac;
color: #000000;
float: left;
border: 1px solid #000000;
text-align: center;
}
en als ik mijn venster verklein dan gaat mijn container mee en mijn header ook:) mischien ligt het ook daaraan? iemand de commands voor mij?
Tutorial 1
Tutorial 2
Tutorial 3
Gewijzigd op 01/01/1970 01:00:00 door Jan Koehoorn
CSS
Code (php)
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
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
/* OPMAAK TEKST EN BODY */
body {
background: #cfcfcf;
color: #646464;
margin: 0px;
}
a {
text-decoration: none;
color: #646464;
}
a:hover {
text-decoration: underline;
}
/* HEADER */
#header {
margin: 0px auto;
width: 430px;
height: 150px;
background-image: url('../images/header.jpg');
border: 2px solid #000000;
background-repeat: no-repeat;
color: #ffffff;
}
#hr {
border: 1px;
color: #ffffff;
}
#millshot {
float: left;
padding-right: 40px;
}
#volgjemij {
float: right;
padding-left: 40px;
height: 25%;
width: 25%;
margin: 15px;
}
/* OPMAAK BLOKKEN */
#container {
background-color: #acacac;
width: 430px;
top: 17px;
color: #646464;
text-align: left;
border: 2px solid #000000;
margin: 10px auto;
}
#menu {
margin-left: 200px;
margin-bottom: -90px;
}
body {
background: #cfcfcf;
color: #646464;
margin: 0px;
}
a {
text-decoration: none;
color: #646464;
}
a:hover {
text-decoration: underline;
}
/* HEADER */
#header {
margin: 0px auto;
width: 430px;
height: 150px;
background-image: url('../images/header.jpg');
border: 2px solid #000000;
background-repeat: no-repeat;
color: #ffffff;
}
#hr {
border: 1px;
color: #ffffff;
}
#millshot {
float: left;
padding-right: 40px;
}
#volgjemij {
float: right;
padding-left: 40px;
height: 25%;
width: 25%;
margin: 15px;
}
/* OPMAAK BLOKKEN */
#container {
background-color: #acacac;
width: 430px;
top: 17px;
color: #646464;
text-align: left;
border: 2px solid #000000;
margin: 10px auto;
}
#menu {
margin-left: 200px;
margin-bottom: -90px;
}
En je HTML (je had geen HTML tags, geen DOCTYPE en geen HEAD tags!!)
Code (php)
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
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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
@import 'test.css';
</style>
</head>
<body>
<div id="header">
<h1>header</h1>
</div>
<div id="menu">
<a href="index2.htm">Home</a><br>
<a href="index2.htm">statistieken</a><br>
gastenboek beheer<br>
verslagen beheer<br>
</div>
<div id="container">
<h1>container</h1>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
</div>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
@import 'test.css';
</style>
</head>
<body>
<div id="header">
<h1>header</h1>
</div>
<div id="menu">
<a href="index2.htm">Home</a><br>
<a href="index2.htm">statistieken</a><br>
gastenboek beheer<br>
verslagen beheer<br>
</div>
<div id="container">
<h1>container</h1>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
</div>
</body>
</html>
Gewijzigd op 01/01/1970 01:00:00 door Jan Koehoorn
Quote:
En je HTML (je had geen HTML tags, geen DOCTYPE en geen HEAD tags!!)
Ik had alleen de tekst tussen <body></body> gekopieerd ;)
Thnx.
Maar dan het volgende probleem in mijn menu, mijn links doen het alleen in Firefox en niet in IE :)
Hij ligt aan die Margin-bottom ;)