CSS/Div vraag
Ik ben momenteel bezig met een site, waarbij ik gebruik maak van div. Ik heb de volgende div's:
- Kop
- Voet
- Menu (zit in navigatie)
- Content (hierin heb ik nog een iframe zitten met de naam tekst, die dus over de gehele content te zien moet zijn).
de css ziet er als volgt uit:
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
77
78
79
80
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
@charset "utf-8";
/* CSS Document */
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
font-family: Georgia, Times, "Times New Roman", serif;
color: black;
height: 100%;
/* width: 100%; */
}
#kop {
background-color: #666;
color: white;
text-align:center;
font-family: Georgia, Times, "Times New Roman", serif;
height:70px;
font-size: 19px;
border: 1px solid #333;
}
#navigatie {
float: left;
width: 160px;
/*
height:410px;
*/
height: 100%;
margin-left: 0px;
background-color:#CCCCCC;
border-color:red;
padding-top: 0.5em;
border-right: 1px solid black;
border-left: 1px solid black;
}
#inhoud {
/* margin: 0 2em 0 160px; */
margin: 0 0 0 0px;
text-align:center;
font-size:13px;
height: 100%;
padding-top: 0.5em;
/* border: 1px solid #333; */
}
#footer {
clear: both;
background-color: #ccc;
text-align:center;
font-size:11px;
padding-bottom: 1em;
border: 1px solid #333;
padding-left: 50px;
height:25px;
widht: 100%;
}
.menulines{
font-family: Georgia, Times, "Times New Roman", serif;
border:2.5px solid #F0F0F0;
}
.menulines a{
font-family: Georgia, Times, "Times New Roman", serif;
text-decoration:none;
color:#666666;
}
#menu {
margin-left: 6px;
}
.h1 {
font-size:16px;
}
/* CSS Document */
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
font-family: Georgia, Times, "Times New Roman", serif;
color: black;
height: 100%;
/* width: 100%; */
}
#kop {
background-color: #666;
color: white;
text-align:center;
font-family: Georgia, Times, "Times New Roman", serif;
height:70px;
font-size: 19px;
border: 1px solid #333;
}
#navigatie {
float: left;
width: 160px;
/*
height:410px;
*/
height: 100%;
margin-left: 0px;
background-color:#CCCCCC;
border-color:red;
padding-top: 0.5em;
border-right: 1px solid black;
border-left: 1px solid black;
}
#inhoud {
/* margin: 0 2em 0 160px; */
margin: 0 0 0 0px;
text-align:center;
font-size:13px;
height: 100%;
padding-top: 0.5em;
/* border: 1px solid #333; */
}
#footer {
clear: both;
background-color: #ccc;
text-align:center;
font-size:11px;
padding-bottom: 1em;
border: 1px solid #333;
padding-left: 50px;
height:25px;
widht: 100%;
}
.menulines{
font-family: Georgia, Times, "Times New Roman", serif;
border:2.5px solid #F0F0F0;
}
.menulines a{
font-family: Georgia, Times, "Times New Roman", serif;
text-decoration:none;
color:#666666;
}
#menu {
margin-left: 6px;
}
.h1 {
font-size:16px;
}
De div's:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<div id="kop"></div>
<div id="navigatie">
<div id="menu">
</div>
</div>
<div id="inhoud"><iframe frameborder="1" marginheight="0" marginwidth="0" src="tekst.php" name="tekst"></iframe></div>
<div id="footer"></div>
<div id="navigatie">
<div id="menu">
</div>
</div>
<div id="inhoud"><iframe frameborder="1" marginheight="0" marginwidth="0" src="tekst.php" name="tekst"></iframe></div>
<div id="footer"></div>
Ik heb nu dat de kop over de breedte is, navigatie en inhoud naast elkaar, footer over de breedte, alleen de hoogte staat nu op 100% van navigatie en inhoud, waardoor hij het scherm hoogte als 100% neemt, ik krijg dus een scroll balk omdat de kop en footer nog bovenop die 100% komen.
In firefox staat de inhoud niet naast de navigatie, maar onder de pagina (dwars door de footer heen).
Ik hoop dat mijn probleem een beetje duidelijk is uitgelegt.
Gewijzigd op 01/01/1970 01:00:00 door Kitty N
Een online voorbeeldje zou ook gewaardeerd worden, maakt het wat makkelijker.
Overigens, why the hell een iframe voor je content?
Gewijzigd op 01/01/1970 01:00:00 door Mitchell
Ik heb een iframe zodat alleen het ifram opnieuw geladen wordt en niet de rest, zo is het menu dus maar 1x gemaakt.
Zie http://testsilvia.silty.nl/ voor voorbeeld.
Zie zonder 100% height in menu, content en body
Gewijzigd op 01/01/1970 01:00:00 door kitty N
Ik heb 't effe getest en werkt prima :)
Hoewel ik niet zou kiezen voor een <iframe>
Zet in je silvia.css onder #inhoud
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
#inhoud {
margin: 0 0 0 0px;
text-align:center;
font-size:13px;
height: 99%;
padding: 0.1em;
overflow:hidden;
}
margin: 0 0 0 0px;
text-align:center;
font-size:13px;
height: 99%;
padding: 0.1em;
overflow:hidden;
}
grts,
René
Lapidi schreef op 27.03.2009 20:49:
width 100% in combinatie met padding geeft in sommige browser problemen. padding wordt namelijk opgeteld bij de width, wat resulteert dat je div breder is dan eigenlijk kan.
i know, maar ja zo zag 't er weer wat beter uit kan ze weer verder :D.
Div's in FF is meestal een CRIME :D
Kan ik nu gaan puzzelen met het menu, zodat deze helemaal doorloopt naar onder tot aan de footer.
Ik wil eigenlijk ook proberen om het op het gehele scherm te zien dat je dus niet moet scrollen voor de footer. Helaas werkt dat niet met height 100% navigatie staat nu op height 100%
Gewijzigd op 01/01/1970 01:00:00 door kitty N
Dat had ik misschien beter kunnen doen, maar dat lost mijn probleem nog niet op.
Weet iemand misschien hoe ik het volgende kan doen:
Is er een mogelijkheid om te kijken hoeveel pixels de hoogte van het scherm is, want stel je hebt een kop die geef je 50px mee als hoogte en je voet geef je 20px mee als hoogte. Dat je dan berekent hoeveel pixels er zijn, zodat ik dan het aantal pixels - kop - voet = pixels over
Zodat ik dan het aantal pixels over kan invullen bij de content als hoogte.
Waarom wil ik dit doen?
Omdat ieder scherm kwa grootte verschillend is. De ene heeft een 19 inch scherm en de ander maar een 15 inch.
En stel dat javascript niet aanstaat dan ziet iemand de site totaal anders. Ik raad je aan om gewoon te stoppen met dit idee van je (een layout totaal liquid in height) of je zult hacks zoals negatieve margins/paddings moeten gaan gebruiken.
Edit: Je zou ook met positions kunnen gaan werken, maar dan moet je daar natuurlijk wel mee moeten kunnen omgaan..
Gewijzigd op 01/01/1970 01:00:00 door Mitchell
Bedankt voor je antwoord, met position heb ik ook wat geprobeerd. Heb altijd gebruik gemaakt van frames, maar wil daar graag vanaf stappen. Ben daarom dus met div's aan het werk, wat dus erg nieuw voor mij is en weet dus ook niets tot niet veel van position af helaas. Heb ook al de site van w3school erbij gepakt.
Ik zal het daar eens mee proberen, dit doe ik zodra ik thuis ben kan het dan op 3 verschillende scherm(groottes) testen. Het hoeft namelijk geen proffesionele site te zijn.
Ik ben daar lang lang lang geleden ook eens flink mee aan het 'zooien' geweest.
Schiet me net pas wat te binnen wat bij mij 't probleem toen de tijd was.
zie : http://swf2.sq4.nl/silvia/index2.php
Dat ziet er niet uit...
Hieronder zie je de <!DOC tag....
Code (php)
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
http://swf2.sq4.nl/silvia/index.php
Dit ziet er al een stuk beter uit :P (teminste bij mij) ...
Code (php)
1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
in de css heeft de body een margin van 5px, maar dat had ik ff gedaan om te zien of het ook netjes in 't scherm komt.
http://swf2.sq4.nl/silvia/silvia.css dit is de css met hier en daar wat aanpassingen
Ik hoop dat je d'r wat mee kunt Groetjes,
René
Bedankt :) Ik ga hier mee aan de slag, heb de css overgenomen, maar ik zie dat jij ook tabbelen hebt gebruikt, dus dat ga ik nog even veranderen. (dat het bij mij ook tabbelen zijn)
kitty schreef op 30.03.2009 14:50:
@ René,
Bedankt :) Ik ga hier mee aan de slag, heb de css overgenomen, maar ik zie dat jij ook tabbelen hebt gebruikt, dus dat ga ik nog even veranderen. (dat het bij mij ook tabbelen zijn)
Bedankt :) Ik ga hier mee aan de slag, heb de css overgenomen, maar ik zie dat jij ook tabbelen hebt gebruikt, dus dat ga ik nog even veranderen. (dat het bij mij ook tabbelen zijn)
Ja ik heb destijds ook gekozen voor tabellen omdat firefox en opera dacht ik, er anders een zooitje van maakte.
En zoals je ziet in http://swf2.sq4.nl/silvia/index.php, wanneer je nu je browser window groter/kleiner maakt dat de layout zich aanpast.
pim Willems schreef op 28.03.2009 18:38:
Ipv iFrame zou je trouwens beter een php include kunnen gebruiken, werkt makkelijker mooier en sneller.
zoals pim schreef : en met include werken heeft nog meer voordelen je maakt simpel je content pagina`s aan desnoods als "wiebenik.txt" zonder welke headers etc.
en op de plaats van * inhoud * zet je < ? include("wiebenik.txt") ? > hoewel het natuurlijk veel netter is om het zo te maken dat je niet de pagina met een variable werkt.
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<?php
$pagina_naam=$_GET['p'];
if (!file_exists($pagina_naam.".txt")) {
$pagina_naam="bestaat_niet";
}
?>
$pagina_naam=$_GET['p'];
if (!file_exists($pagina_naam.".txt")) {
$pagina_naam="bestaat_niet";
}
?>
* inhoud * vervang je dan voor < ? include($pagina_naam.".txt") ? >
aanroep is dan http://swf2.sq4.nl/silvia/index.php?p=wiebenik
de bovenstaande link, werkt al zoals ik het hier heb uitgelegd.
je moet dan wel zelf nog even bestaat_niet.txt aanmaken.
Groetjes,
René
Ik ben nu bezig met jou css en tabbelen, het ziet er al een stuk beter uit. Helaas ben ik nog niet thuis en kan het dus nog niet uploaden. De footer blijft nu staan. Werk nu gelijk met includes zodat ik geen iframe hoef te gebruiken. Ik heb alleen nog 1 vraag, ik heb de inhoud nu ook op 100% gezet net als navigatie, loopt dus nu ook mooi door tot aan de footer. Ben nu alleen nog aan het puzzelen om hem dan in de breedte ook helemaal te vullen.
Groetjes Kitty
Grts. René
Het staat nu online. Zoals je ziet heb ik om de inhoud even een border gezet zodat ik kan zien tot waar deze loopt. Graag zou ik willen dat de inhoud ook helemaal uitgelijnd wordt naar rechts. Dus ook beeldvullend. (net als de kop en voet)
Misschien begrijp je nu wat ik bedoel?
Gewijzigd op 01/01/1970 01:00:00 door kitty N
kitty schreef op 30.03.2009 15:42:
Dit gaat automatisch wanneer je het <iframe> verhaal vervangt voor de oplossing zoals ik die al eerder heb uitgelegd, paar berichten terug. include verhaal. @ Rene, is goed. In ieder geval bedankt voor je moeite. Tussen half 6 en 6 uur staat het online.
Het staat nu online. Zoals je ziet heb ik om de inhoud even een border gezet zodat ik kan zien tot waar deze loopt. Graag zou ik willen dat de inhoud ook helemaal uitgelijnd wordt naar rechts. Dus ook beeldvullend. (net als de kop en voet)
Misschien begrijp je nu wat ik bedoel?
Het staat nu online. Zoals je ziet heb ik om de inhoud even een border gezet zodat ik kan zien tot waar deze loopt. Graag zou ik willen dat de inhoud ook helemaal uitgelijnd wordt naar rechts. Dus ook beeldvullend. (net als de kop en voet)
Misschien begrijp je nu wat ik bedoel?
http://swf2.sq4.nl/silvia/index.php?p=wiebenik enz.
als je de php source wilt zien van index.php
http://swf2.sq4.nl/silvia/index.phps
* EDIT *
Oeps werkt effe niet..
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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<?php
$pagina_naam=$_GET['p'];
if (!file_exists($pagina_naam.".txt")) {
$pagina_naam="bestaat_niet";
}
?>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Silvia Lombarts</title>
<link rel="stylesheet" type="text/css" href="silvia.css" />
<script language="JavaScript1.2" type="text/javascript">
//<![CDATA[
function over_effect(e,state)
{
if (document.all)
source4=event.srcElement
else if (document.getElementById)
source4=e.target
if (source4.className=="menulines")
source4.style.borderStyle=state
else
{
while(source4.tagName!="TABLE")
{
source4=document.getElementById? source4.parentNode : source4.parentElement
if (source4.className=="menulines")
source4.style.borderStyle=state
}
}
}
function UR_Start()
{
UR_Nu = new Date;
UR_Indhold = showFilled(UR_Nu.getHours()) + ":" + showFilled(UR_Nu.getMinutes()) + ":" + showFilled(UR_Nu.getSeconds());
document.getElementById("ur").innerHTML = UR_Indhold;
setTimeout("UR_Start()",1000);
}
function showFilled(Value)
{
return (Value > 9) ? "" + Value : "0" + Value;
}
//]]>
</script>
</head>
<body onload="UR_Start()">
<div id="north">
<table cellSpacing=0 cellPadding=0 border="0" height="100%" width="100%">
<tbody>
<tr><td height="70" valign="top" >
<div id="kop">Silvia Lombarts</div>
</td></tr>
<tr><td valign="top" >
<div id="navigatie">
<div id="menu">
<table onMouseover="over_effect(event,'outset')" onMouseout="over_effect(event,'solid')" onMousedown="over_effect(event,'inset')" onMouseup="over_effect(event,'outset')" style="background-color:#F0F0F0">
<tr>
<td width="140" bgcolor="#E6E6E6"><font family: Georgia, Times, "Times New Roman", serif; size="3"><b>Menu</b></font></td>
</tr>
<tr>
<td width="140" class="menulines"><font face="Arial" size="2"><a href="tekst.php" target="tekst">Home</a></font></td>
</tr>
<tr>
<td width="100%" class="menulines"><font face="Arial" size="2"><a href="wiebenik.php" target="tekst">Wie
ben ik?</a></font></td>
</tr>
<tr>
<td width="100%" class="menulines"><font face="Arial" size="2"><a href="stage.php" target="tekst">Stage</a></font></td>
</tr>
<tr>
<td width="100%" class="menulines"><font face="Arial" size="2"><a href="links.php" target="tekst">Links</a></font></td>
</tr>
</table>
</div>
</div>
<div id="inhoud"><? include($pagina_naam.".txt") ?> </div>
</td></tr>
<tr ><td valign="top" height="10">
<div id="footer"> Silty products<br /> 27-03-2009 <font id="ur"></font> </div>
</td></tr>
</tbody>
</table>
</div>
</body>
</html>
<?php
$pagina_naam=$_GET['p'];
if (!file_exists($pagina_naam.".txt")) {
$pagina_naam="bestaat_niet";
}
?>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Silvia Lombarts</title>
<link rel="stylesheet" type="text/css" href="silvia.css" />
<script language="JavaScript1.2" type="text/javascript">
//<![CDATA[
function over_effect(e,state)
{
if (document.all)
source4=event.srcElement
else if (document.getElementById)
source4=e.target
if (source4.className=="menulines")
source4.style.borderStyle=state
else
{
while(source4.tagName!="TABLE")
{
source4=document.getElementById? source4.parentNode : source4.parentElement
if (source4.className=="menulines")
source4.style.borderStyle=state
}
}
}
function UR_Start()
{
UR_Nu = new Date;
UR_Indhold = showFilled(UR_Nu.getHours()) + ":" + showFilled(UR_Nu.getMinutes()) + ":" + showFilled(UR_Nu.getSeconds());
document.getElementById("ur").innerHTML = UR_Indhold;
setTimeout("UR_Start()",1000);
}
function showFilled(Value)
{
return (Value > 9) ? "" + Value : "0" + Value;
}
//]]>
</script>
</head>
<body onload="UR_Start()">
<div id="north">
<table cellSpacing=0 cellPadding=0 border="0" height="100%" width="100%">
<tbody>
<tr><td height="70" valign="top" >
<div id="kop">Silvia Lombarts</div>
</td></tr>
<tr><td valign="top" >
<div id="navigatie">
<div id="menu">
<table onMouseover="over_effect(event,'outset')" onMouseout="over_effect(event,'solid')" onMousedown="over_effect(event,'inset')" onMouseup="over_effect(event,'outset')" style="background-color:#F0F0F0">
<tr>
<td width="140" bgcolor="#E6E6E6"><font family: Georgia, Times, "Times New Roman", serif; size="3"><b>Menu</b></font></td>
</tr>
<tr>
<td width="140" class="menulines"><font face="Arial" size="2"><a href="tekst.php" target="tekst">Home</a></font></td>
</tr>
<tr>
<td width="100%" class="menulines"><font face="Arial" size="2"><a href="wiebenik.php" target="tekst">Wie
ben ik?</a></font></td>
</tr>
<tr>
<td width="100%" class="menulines"><font face="Arial" size="2"><a href="stage.php" target="tekst">Stage</a></font></td>
</tr>
<tr>
<td width="100%" class="menulines"><font face="Arial" size="2"><a href="links.php" target="tekst">Links</a></font></td>
</tr>
</table>
</div>
</div>
<div id="inhoud"><? include($pagina_naam.".txt") ?> </div>
</td></tr>
<tr ><td valign="top" height="10">
<div id="footer"> Silty products<br /> 27-03-2009 <font id="ur"></font> </div>
</td></tr>
</tbody>
</table>
</div>
</body>
</html>
Dan maar effe zo ;-)
Groetjes, René
Gewijzigd op 01/01/1970 01:00:00 door Rene Sn
Ik heb nu hetzelfde als jou voorbeeld. Dus met die .txt dat werkt ook, alleen ziet dit er hetzelfde uit als gister, waarschijnlijk dacht je gister dat ik iframe gebruikte vanwege de border. Maar dat is niet zo, ik had een border gezet om de div inhoud. Hier even mijn codes:
index.php
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
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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<?php
$pagina_naam=$_GET['p'];
if (!file_exists($pagina_naam.".txt")) {
$pagina_naam="bestaat_niet";
}
?>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
<title>Silvia Lombarts</title>
<link href="silvia.css" type="text/css" rel="stylesheet">
<?php
include("js.php");
?>
</head>
<body onload="UR_Start()">
<div id="north">
<table height="100%" cellspacing="0" cellpadding="0" border="0" width="100%">
<tbody>
<?php
include("hoofd.php");
?>
<tr> <!-- Start Midden stuk -->
<td valign="top">
<?php
include("menu.php");
?>
<div id="inhoud" align="center"><?php include($pagina_naam.".txt") ?></div>
</td>
</tr> <!-- Einde menu -->
<?php
include("footer.php");
?>
</tbody>
</table>
</div>
</body>
</html>
<?php
$pagina_naam=$_GET['p'];
if (!file_exists($pagina_naam.".txt")) {
$pagina_naam="bestaat_niet";
}
?>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
<title>Silvia Lombarts</title>
<link href="silvia.css" type="text/css" rel="stylesheet">
<?php
include("js.php");
?>
</head>
<body onload="UR_Start()">
<div id="north">
<table height="100%" cellspacing="0" cellpadding="0" border="0" width="100%">
<tbody>
<?php
include("hoofd.php");
?>
<tr> <!-- Start Midden stuk -->
<td valign="top">
<?php
include("menu.php");
?>
<div id="inhoud" align="center"><?php include($pagina_naam.".txt") ?></div>
</td>
</tr> <!-- Einde menu -->
<?php
include("footer.php");
?>
</tbody>
</table>
</div>
</body>
</html>
Voor ik die include $pagina_naam gebruikte had ik die andere omgezet naar includes.
ccs:
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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
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
@charset "utf-8";
/* CSS Document */
* {
margin: 0;
padding: 0;
}
html {
height: 100%;width:100%;
overflow:hidden;
}
body {
padding: 0;
font-family: Georgia, Times, "Times New Roman", serif;
color: black;
height: 100%;
width:100%;
overflow:hidden;
}
#kop {
background-color: #666;
color: white;
text-align:center;
font-family: Georgia, Times, "Times New Roman", serif;
height:70px;
font-size: 19px;
border: 1px solid #333;
}
#navigatie {
float: left;
width: 165px;
height: 100%;
margin-left: 0px;
background-color:#CCCCCC;
border-color:red;
padding-top: 0.5em;
border-right: 1px solid black;
border-left: 1px solid black;
}
#inhoud {
float:left;
margin: 0 0 0 0px;
text-align:center;
font-size:13px;
height: 100%;
padding: 0.1em;
overflow:hidden;
position: static;
border: 1px solid #333;
}
#footer {
float:bottom;
background-color: #ccc;
text-align:center;
font-size:11px;
padding-bottom: 1em;
border: 1px solid #333;
padding-left: 50px;
height:25px;
position: static;
}
.links:link {
color: #000000;
}
.links:visited {
color: #000000;
}
.links:Hover {
color: #FF0000;
}
.menulines{
font-family: Georgia, Times, "Times New Roman", serif;
border:2.5px solid #F0F0F0;
}
.menulines a{
font-family: Georgia, Times, "Times New Roman", serif;
text-decoration:none;
color:#666666;
}
#menu {
margin-left: 6px;
}
.h1 {
font-size:16px;
}
/* CSS Document */
* {
margin: 0;
padding: 0;
}
html {
height: 100%;width:100%;
overflow:hidden;
}
body {
padding: 0;
font-family: Georgia, Times, "Times New Roman", serif;
color: black;
height: 100%;
width:100%;
overflow:hidden;
}
#kop {
background-color: #666;
color: white;
text-align:center;
font-family: Georgia, Times, "Times New Roman", serif;
height:70px;
font-size: 19px;
border: 1px solid #333;
}
#navigatie {
float: left;
width: 165px;
height: 100%;
margin-left: 0px;
background-color:#CCCCCC;
border-color:red;
padding-top: 0.5em;
border-right: 1px solid black;
border-left: 1px solid black;
}
#inhoud {
float:left;
margin: 0 0 0 0px;
text-align:center;
font-size:13px;
height: 100%;
padding: 0.1em;
overflow:hidden;
position: static;
border: 1px solid #333;
}
#footer {
float:bottom;
background-color: #ccc;
text-align:center;
font-size:11px;
padding-bottom: 1em;
border: 1px solid #333;
padding-left: 50px;
height:25px;
position: static;
}
.links:link {
color: #000000;
}
.links:visited {
color: #000000;
}
.links:Hover {
color: #FF0000;
}
.menulines{
font-family: Georgia, Times, "Times New Roman", serif;
border:2.5px solid #F0F0F0;
}
.menulines a{
font-family: Georgia, Times, "Times New Roman", serif;
text-decoration:none;
color:#666666;
}
#menu {
margin-left: 6px;
}
.h1 {
font-size:16px;
}
Wat ik nu bedoel is dat de tekst uitgelijnt moet worden in het midden (de tekst van inhoud). Als je kijkt op http://testsilvia.silty.nl staat de tekst rechts, omdat inhoud niet helemaal doorloopt in de breedte. Misschien met het voorbeeld http://silvia.silty.nl dat het dan wat duidelijker wordt. Zoals je kan zien op die pagina wordt alles nog niet uitgerekt en is dat gemaakt op een 15 inch scherm.
silvia.silty.nl pakt hij alleen nog niet goed in ie..maar die pagina gaat zowiezo weg moet vervangen worden door testsilvia
Gewijzigd op 01/01/1970 01:00:00 door kitty N