Web page not showing correctly

[Skewled]

So im triyng to get this to work now this is on my main page if it works ill try it on my login page later.

indexnl.php

<div id="wrapper">
	<nav>
		<ul class="lang"><?php include("includes/lang.php"); ?></ul>		
            <ul class="menu"><?php include("includes/menu.php"); ?></ul>
	</nav> 

menu.php

<li><a class="active" title="home" href="indexnl.html">Home</a></li>
<li><a title="Leden" href="ledennlp1.html">Leden</a></li>
<li><a title="Album" href="albumnl.html">Album</a></li>
<li><a title="Kalender" href="kalendernl.html">Kalender</a></li>
<li><a title="Contact" href="contactnl.html">Contact</a></li> 

 

now is this the correct way to do it?

 

thanks

 

This is how I do it to keep my code structured and then I can globally change the links in 1 file rather then multiple page edits.

 

 

As for the CSS, if your using firefox you can get the addon called firebug and visually inspect the elements. This is what I'm using to see your CSS...

 

 

[Skewled]

remove the <article> </article> <section> </section> tags completely. I want to see what it looks like without those..

 

 

[wezze]

just the class="active" part of the code i removed cause that wont work here.

im using google chrome as standard and IE8 to see if the page loads good.

/* Eric Meyer Reset CSS File */

@import url("reset.css");

/* Template Layout CSS */

body
{
background: #000;
font-family: Helvetica, Arial, sans-serif;
color: #888;
padding: 20px;
font-size: 14px;
}

a { color: #0099FF; }
a.member { color: #888; }
a:hover { color: #FFF; }
p { margin: 0 0 15px 0; }

a img.imgright { float: right; padding: 5px; margin: 0 0 10px 15px; border: 1px solid #333; }
a:hover img.imgright { border: 5px solid #0099FF; padding: 1px; margin: 0 0 10px 15px; }
a img.member { padding: 5px; margin: 0 0 10px 15px; border: 1px solid #333; width: 208px; height: 200px; }
a:hover img.member { border: 5px solid #0099FF; padding: 1px; margin: 0 0 10px 15px; }
a img.members { padding: 5px; margin: 0 0 10px 15px; border: 1px solid #333; width: 158px; height: 150px; }
a:hover img.members { border: 5px solid #0099FF; padding: 1px; margin: 0 0 10px 15px; }

h1, h2, h3, h4, h5 { font-weight: bold; font-size: 24px; margin: 0 0 15px 0; color: #FFF; text-shadow: 2px 2px 2px #000000; }

/* Start Wrapper Container */

#wrapper
{
width: 940px;
margin: 0 auto;
}

/* End Wrapper Container */

/* Gastenboek table */
table.gast
{
display:table;
    width:100%;
border-width:1px; 
border-spacing:2px; 
border-style:outset; 
border-color:#0099FF; 
border-collapse:collapse;
background-color:none;
}

/* End Gastenboek table */

/* Start Nav Styles */

nav
{
width: 940px;
height: 40px;
}

nav ul.menu
{
float: right;
}

nav ul.menu li
{
display: inline;
}

nav ul.menu li a
{
float: left;
line-height: 40px;
padding: 0 20px;
background: #111;
color: #FFF;
font-weight: bold;
}

nav ul.menu li a.active
{
background: #191919;
color: #0099FF;
}

nav ul.menu li a:hover
{

color: #0099FF;
}

/* nl/fr position */
nav ul.lang
{
float: left;
}

nav ul.lang li 
{
float: left;
background: url(../images/divider.gif) repeat-y right top;
padding-right: 25px;
margin-right: 25px;
}

nav ul.lang li.last 
{
background: none;
padding-right: 0;
margin-right: 0;
}

nav ul.lang li a 
{
text-decoration: none;
}

nav ul.lang li a:hover 
{
text-decoration: underline; 
}

/* Start Header Styles */

header
{
width: 900px;
height: 120px;
padding: 0 20px;
background: #191919;
}

header h1
{
font-size: 42px;
line-height: 120px;
text-align: right;
font-weight: bold;
letter-spacing: -2px;

text-shadow: 2px 2px 2px #000000;
}

header h1 a
{
color: #FFF;
}

header h1 a:hover
{
color: #0099FF;
}

/* End Header Styles */

/* Start Main Styles */

section#main
{
width: 940px;
line-height: 24px;
}

section#content
{
float: left;
width: 560px;
padding: 20px;
}

	/*** Form ***/
section#form1
{
    width: 250px;
    padding: 20px;
    border: 1px solid #0099FF;

    /*** Rounded Corners ***/
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
}

aside#form
{
    width: 250px;
    padding: 20px;
    border: 1px solid #0099FF;

    /*** Rounded Corners ***/
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
}
	/***end-Form ***/
aside#sidebar
{
float: left;
width: 300px;
padding: 20px;
}

aside#sidebar ul
{
margin: 0 0 15px 0;
}

aside#sidebar ul li
{
display: block;
}

aside#sidebar ul li a
{
float: left;
width: 280px;
padding: 6px 10px;
border-left: 3px solid #222;
margin: 0 0 5px 0;
line-height: 20px;
}

aside#sidebar ul li a:hover
{
background: #0099FF;
border-left: 3px solid #FFFFF;
color: #111;
}

/* End Main Styles */

/* Start Footer Styles */

footer section#footertop
{
width: 940px;
line-height: 22px;
border-top: 1px dotted #333;
}

aside.footer-column
{
float: left;
width: 430px;
padding: 20px;
}

section#copyright
{
clear: both;
width: 900px;
padding: 20px;
line-height: 22px;
font-size: 12px;
text-align: left;
border-top: 1px dotted #333;
}

section#banners
{
width:900px;
overflow:hidden;
}

section#banners li 
{
float:left;
width:275px;
margin-right:30px;
line-height:1.571em;
background:url(../images/banner-tail.gif) repeat-y left top;
border: 1px solid #0099FF;
/*** Rounded Corners ***/
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
}

section#banners li.last 
{
margin-right:0;
}

section#banners li span 
{
display:block;
background:url(../images/banner-top.jpg) no-repeat left top;
}

section#banners li span span 
{
background:url(../images/banner-bot.gif) no-repeat left bottom;
min-height:114px;
height:auto !important;
height:114px;
}

section#banners li span span span 
{
min-height:1px;
height:auto !important;
height:1px;
background:none;
padding:11px 15px 10px 17px;
}

section#banners li img 
{
float:left;
margin-right:15px;
}

section#banners li a em 
{
color:#fff;
font-style:normal;
}

section#banners li strong 
{
color:#00000;
display:block;
}

/* End Footer Styles */

/* Start Template Copyright Styles */

section#templatecopy
{
clear: both;
width: 900px;
padding: 20px;
line-height: 22px;
text-align: center;
font-size: 12px;
border-top: 1px dotted #333;
}

section#templatecopy a
{
font-weight: bold;
}

/* End Footer Styles */

as you can see i didnt write this only modified some parts and added some code.

 

im gona try your last post was alrdy typing this 1

thx

[wezze]

http://mcbevers.be/login/index.php but you need to log in with test1 pass test still shows but not good.

[Skewled]

add them back:

 

<section>

<article>

 

</section>

</article>

 

It's a CSS issue, maybe post in the CSS help forum for some guru to see and give a quick fix to it. 

[wezze]

ok ive asked in css but no answer exept for validator and firefox use.

so i searched again and looked over the code again and again when i saw this

echo "<table width='600' cellpadding='5' cellspacing='5' border='1'>";
echo "<p>Welcome <b>$session->username</b></p> <br/><br/>"
."<tr><td>[<a href=\"userinfo.php?user=$session->username\">My Account</a>]</td></tr>"
."<tr><td>[<a href=\"useredit.php\">Edit Account</a>]</td></tr>";
if($session->isAdmin()){
echo "<tr><td>[<a href=\"admin/admin.php\">Admin Center</a>]</td></tr>";
echo "<tr><td>[<a href=\"../gastenboek/admin/index.php\">Gastenboek</a>]</td></tr>";
echo "<tr><td>[<a href=\"../livre d'or/admin/index.php\">livre d'or</a>]</td></tr>";
echo "<tr><td>[<a href=\"../upload_album/upload.form.php\">upload album</a>]</td></tr>";  
echo "<tr><td>[<a href=\"../upload_kalender/upload.form.php\">upload kalender</a>]</td></tr>";   

}
echo "<tr><td>[<a href=\"process.php\">Logout</a>]</td></tr>";

 

i opend a table but doesnt closed it

ive putted back the article and section

and played with this <?}?> until

 

</form>
</section>
<? } ?>
</article>
</section>
<aside id="sidebar">

now i got another problem at the buttom of the page in firebug i see he makes another table where he shows admin/ at the buttom,

only when i moved the php footer to my includes with the rest of my footer content.

 

thx

[Skewled]

Awesome! Yeah Firebug is awesome!!