verhaba
Gebruiker
- Lid geworden
- 8 feb 2008
- Berichten
- 79
Hallo mensen
Ik ben bezig aan een website. Ik heb een header en een rechtse navigatie menu. Tot op vandaag had ik alles in één zelfde file. Per index.php had ik steeds de code voor de navigatie en voor de header. Ik heb ook al wat opmaak via css verzorgd. Toegeven, moeilijker om te onderhouden terwijl er handigere manieren van werken zijn.
Daarom kwam ik op het idee op header (header.php) en navigatie-menu ( navbar_right.php) in elk een apart php'tjes te bewaren en ze gewoon te includen in gelijk welke pagina ik deze twee nodig heb. Alle files verwijzen naar hetzelfde css bestand.
Nu, daar zit het probleem. Ik merk een verschil in opmaak. klik op de screenshots op het verschil te zien. Is dit normaal en hoe kan ik dit oplossen?
Alvast bedankt voor jullie hulp.
site met include
site zonder include
default.css
header.php
navbar_right.php:
main.php
Ik ben bezig aan een website. Ik heb een header en een rechtse navigatie menu. Tot op vandaag had ik alles in één zelfde file. Per index.php had ik steeds de code voor de navigatie en voor de header. Ik heb ook al wat opmaak via css verzorgd. Toegeven, moeilijker om te onderhouden terwijl er handigere manieren van werken zijn.
Daarom kwam ik op het idee op header (header.php) en navigatie-menu ( navbar_right.php) in elk een apart php'tjes te bewaren en ze gewoon te includen in gelijk welke pagina ik deze twee nodig heb. Alle files verwijzen naar hetzelfde css bestand.
Nu, daar zit het probleem. Ik merk een verschil in opmaak. klik op de screenshots op het verschil te zien. Is dit normaal en hoe kan ik dit oplossen?
Alvast bedankt voor jullie hulp.
site met include
site zonder include
default.css
PHP:
body{
position: absolute;
background-color:#000000}
font {color:#CCCCCC}
/* Header in een divje plaatsen */
#header {
margin-top: 10px;
margin-left: 50px;
width:750px;
height: 200px;
background-image: url(../../images/header.jpg);
background-repeat:no-repeat}
/* horizontale navigatiebar */
#navbar_horiz{
margin-bottom: 0.5em;
margin-top: 160px;
}
#navbar_horiz ul {
background-color: silver;
text-align: center;
margin-left: 0;
padding-left: 0;
border-bottom: 1px solid gray;
width: 750px;
}
#navbar_horiz li {
list-style-type: none;
padding: 0.5em 1.2em;
border-left: 1px solid white;
display: inline;
vertical-align:middle;
}
#navbar_horiz li:first-child {
border: none;
}
/* Rechtse navigatie bar*/
#navbar_right{
position:absolute;
background-color:#FFFFFF;
margin-left: 660px;
width: 145px;
height: 630px;
font-family:Verdana, Calibri, Cambria}
.navbar_top{
background: #1E5791;
height: 35px;
vertical-align:middle;
text-align: center;
text-decoration:underline;
font-family:Courier New, Courier, monospace;
color: #FFFFFF;
font-size:18px;
font-style:italic;
font-variant:small-caps;
border-width:2px;
border-color:#FFFFFF;
border-style:solid;
}
.li_navbar{
font-family:Verdana, Calibri, Cambria, Arial, Helvetica, sans-serif;
font-size:12px;
}
#main {
position:absolute;
background-color:#666666;
width: 600px;
margin-left: 50px;
height: 630px;
font-family: verdana, Calibri;
font-size:18pt;
}header.php
PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="shortcut icoN" href="images/andi_europe.ico">
<title>The Big Blue New</title>
<link href="../../css/default.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="header">
<div class="navbar_horiz">
<ul>
<li> Start </li>
<li> Noordzee </li>
<li> Duikshop </li>
<li> Duikschool </li>
<li> Gastenboek </li>
<li> leden toevoegen </li>
</ul>
</div>
</div>
</body>navbar_right.php:
PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="shortcut icoN" href="../../images/andi_europe.ico">
<title>The Big Blue New</title>
<link href="../../css/default.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="navbar_right">
<p class="navbar_top"> duikshop </p>
<ul>
<li class="li_navbar"> winkel </li>
<li class="li_navbar"> nieuws </li>
</ul>
<p class="navbar_top">rebreather</p>
<ul>
<li class="li_navbar"> rEvo </li>
<li class="li_navbar"> opleidingen </li>
</ul>
<p class="navbar_top"> login </p>
<Form method="post" action="login.php">
<p class="li_navbar">username:<br> <input type="text" name="username" width="150px">
<br> password: <br><input type="password" name="password" width="75%"></p>
<input type="submit" value="login" width="25px">
<input name="reset" type="reset" id="reset" value="reset" width = "25px">
</Form>
</div>
</body>
</html>main.php
PHP:
<?php
include 'header.php';
include 'navbar_right.php';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="shortcut icoN" href="../../images/andi_europe.ico">
<title>The Big Blue New</title>
<link href="../../css/default.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="main"> main div </div>
</body>
</html>
Laatst bewerkt:
