css styling probleem met lengte
Ik was dus bezig met css maar iets lukt me nog steeds niet.
Ik probeer de colummen even te krijgen zodat het net zoals deze website linker en rechter div de zelfde lengte hebben.
het moet er zo uit zien:
______________
header
______________
menu |con |
| |
| |
| |
______________|
______________|
Ik heb nu dit:
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
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
<style type="text/css" media="screen">
* {
margin: 0px;
padding: 0px;
}
body {
background: #003399;
margin: 0px;
padding: 20px;
}
h1 {
font: bold 14px arial;
}
h2 {
font: bold 12px arial;
margin-top: 5px;
}
#header {
height: 100px;
width: 0px;
background: #00B8F5;
}
#block {
height: 100px;
width: 609px;
background: #00B8F5;
}
#sidebar {
float: left;
padding: 9px;
width: 100px;
background: #0066FF;
border-right: 3px solid #33CCCC;
}
#content {
margin: 0px 130px 0px 100px;
padding: 9px;
width: 500px;
background: #CCFFFF;
border-right: 1px solid #33CCCC;
}
#under {
float: left-bottom;
padding: 12px;
width: 609px;
margin-top: 0px;
background: #0099FF;
}
p {
font: 0.6em verdana;
}
</style>
<!--[if IE]>
<style>
#header h1 { width: 700px; }
</style>
<![endif]-->
* {
margin: 0px;
padding: 0px;
}
body {
background: #003399;
margin: 0px;
padding: 20px;
}
h1 {
font: bold 14px arial;
}
h2 {
font: bold 12px arial;
margin-top: 5px;
}
#header {
height: 100px;
width: 0px;
background: #00B8F5;
}
#block {
height: 100px;
width: 609px;
background: #00B8F5;
}
#sidebar {
float: left;
padding: 9px;
width: 100px;
background: #0066FF;
border-right: 3px solid #33CCCC;
}
#content {
margin: 0px 130px 0px 100px;
padding: 9px;
width: 500px;
background: #CCFFFF;
border-right: 1px solid #33CCCC;
}
#under {
float: left-bottom;
padding: 12px;
width: 609px;
margin-top: 0px;
background: #0099FF;
}
p {
font: 0.6em verdana;
}
</style>
<!--[if IE]>
<style>
#header h1 { width: 700px; }
</style>
<![endif]-->
en dit als php pagina:
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
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
<link rel="stylesheet" type="text/css" href="style.css">
<body bgcolor="#003399">
<?php
//session_start();
//include("contactdb.php");
echo"<div id=\"block\">";
echo"<div id=\"header\">";
echo"<p align=\"center\"><img border=\"0\" src=\"logo.png\"></p>";
echo"</div>";
//sidebar
echo"<div id=\"sidebar\">";
echo"<h2>Menu</h2>";
echo"link1<br>";
echo"link2<br>";
echo"link3<br>";
echo"link3<br>";
echo"link3<br>";
echo"link3<br>";
echo"</div>";
//content
echo"<div id=\"content\">";
echo"<h2>home</h2>Hallo en welkom!<br>Veel plezier op de website!<br>We hopen een fijne tijd samen te krijgen.";
echo"</div>";
echo"<div id=\"under\">";
echo"©RStipNL";
echo"</div>";
echo"</div>";
?>
<body bgcolor="#003399">
<?php
//session_start();
//include("contactdb.php");
echo"<div id=\"block\">";
echo"<div id=\"header\">";
echo"<p align=\"center\"><img border=\"0\" src=\"logo.png\"></p>";
echo"</div>";
//sidebar
echo"<div id=\"sidebar\">";
echo"<h2>Menu</h2>";
echo"link1<br>";
echo"link2<br>";
echo"link3<br>";
echo"link3<br>";
echo"link3<br>";
echo"link3<br>";
echo"</div>";
//content
echo"<div id=\"content\">";
echo"<h2>home</h2>Hallo en welkom!<br>Veel plezier op de website!<br>We hopen een fijne tijd samen te krijgen.";
echo"</div>";
echo"<div id=\"under\">";
echo"©RStipNL";
echo"</div>";
echo"</div>";
?>
Superwauwie
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
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
<link rel="stylesheet" type="text/css" href="style.css">
<?php
//session_start();
//include("contactdb.php");
?>
<div id=\"block\">
<div id=\"header\">
<p align=\"center\"><img border=\"0\" src=\"logo.png\"></p>
</div>
<div id=\"sidebar\">
<h2>Menu</h2>
<ul>
<li>Link 1</li>
<li>Link 2</li>
<li>Link 3</li>
<li>Link 4</li>
</ul>
</div>
<div id=\"content\">
<h2>Home</h2>
<p>
Hallo en welkom!<br />
Veel plezier op de website!<br />
We hopen een fijne tijd samen te krijgen.
</p>
</div>
<div id=\"under\">
<p>
RStipNL
</p>
</div>
</div>
<?php
//session_start();
//include("contactdb.php");
?>
<div id=\"block\">
<div id=\"header\">
<p align=\"center\"><img border=\"0\" src=\"logo.png\"></p>
</div>
<div id=\"sidebar\">
<h2>Menu</h2>
<ul>
<li>Link 1</li>
<li>Link 2</li>
<li>Link 3</li>
<li>Link 4</li>
</ul>
</div>
<div id=\"content\">
<h2>Home</h2>
<p>
Hallo en welkom!<br />
Veel plezier op de website!<br />
We hopen een fijne tijd samen te krijgen.
</p>
</div>
<div id=\"under\">
<p>
RStipNL
</p>
</div>
</div>
Gewijzigd op 01/01/1970 01:00:00 door --