Need clean up help

pspfreak101 · December 20, 2008

I wanna make my code more browser friendly as it only works on firefox 3 and is not very sufficient so can you please tell me some changes I need to make.

heres the live demo www.hackingclan.com/leetdesigns

Index

<!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=utf-8" />
<title>Leet Designs</title>
<link href="style.css" rel="stylesheet" type="text/css" />

<!-- jcarousel -->
<script type="text/javascript" src="jscript/lib/jquery-1.2.3.pack.js"></script>
<script type="text/javascript" src="jscript/lib/jquery.jcarousel.pack.js"></script>
<link rel="stylesheet" type="text/css" href="jscript/lib/jquery.jcarousel.css" />
<link rel="stylesheet" type="text/css" href="jscript/skin/skin.css" />

<script type="text/javascript">
jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        // Configuration goes here
    });
});
</script>

<!-- jcarousel -->
</head>
<body>
<div id="Wrapper">
<div id="content-wrapper">
<div id="logo"></div>
  <ul id="nav">
        <li id="nav-01"><a href="index.php"><span>Home</span></a></li>
        <li id="nav-divder"></li>
        <li id="nav-02"><a href="index.php?action=about"><span>About</span></a></li>
        <li id="nav-divder"></li>
        <li id="nav-03"><a href="index.php?action=templates"><span>Templates</span></a></li>
        <li id="nav-divder"></li>
        <li id="nav-04"><a href="index.php?action=services"><span>Services</span></a></li>
        <li id="nav-divder"></li>
        <li id="nav-05"><a href="index.php?action=mydesigns"><span>My Designs</span></a></li>
        <li id="nav-divder"></li>
        <li id="nav-06"><a href="index.php?action=register"><span>Register</span></a></li>
        <li id="nav-divder"></li>
        <li id="nav-07"><a href="index.php?action=contact"><span>Contact</span></a></li>
      </ul>
  
  <div id="edge-right"></div>
     <div id="edge-left"></div>
    
<div id="inner">
<div id="inner-body">
  <p class="welcome">Weclome to Leet Designs</p>
  <p class="statement">Our goal is to bring you modern templates</p>
  <p class="statement">at the cheapest price on the web</p>

  <center>
  <div class="jcarousel-skin-tango">
  <div class="jcarousel-container">
    <div disabled="disabled" class="jcarousel-prev jcarousel-prev-disabled"></div>
    <div class="jcarousel-next"></div>
    <div class="jcarousel-clip">
    <ul id="mycarousel" class="jcarousel-skin-tango">
    
    <li><img src="images/appwarez.jpg" width="249" height="204" alt="" /></li>
    <li><img src="images/playstation.jpg" width="249" height="204" alt="" /></li>
    <li><img src="images/killzone2.jpg" width="249" height="204" alt="" /></li>
    <li><img src="images/appwarez.jpg" width="249" height="204" alt="" /></li>
    <li><img src="images/playstation.jpg" width="249" height="204" alt="" /></li>
    <li><img src="images/killzone2.jpg" width="249" height="204" alt="" /></li>

  </ul>
    </div>
  </div>
</div>
</center>

<table width="644" height="108" border="0" cellpadding="0" cellspacing="0" class="bottom-content">
    <tr>
      <td width="174"> </td>
      <td width="14"><div id="bottomdivder"></div></td>
      <td width="177"><p>Latest News:</p>
        <p>Site is in early development expect some major changes</p>
        <p> </p></td>
        <td width="21"><div id="bottomdivder"></div></td>
      <td width="255"><p>Project News:</p>
        <p>My latest project is Appwarez a full php site with its own cms system that will power on through the rest of the sites I make.</p></td>
        <td width="31"><div id="bottomdivder"></div></td>
    </tr>
  </table>

<div class="note" id="note">
    <p class="note-p">Note:</p>
    <p class="note-p">Good with photoshop, html, php join the team and make profits off your own templates now</p>
</div>

<div id="bottom">
  <table width="907" height="338" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
      <td width="286"> </td>
      <td width="286"> </td>
      <td width="304"> </td>
    </tr>
    <tr>
      <td height="172"> </td>
      <td> </td>
      <td> </td>
    </tr>
  </table>
</div>
    </div><!-- Inner-Body -->
  </div><!-- Inner -->
</div><!-- Content-wrapper -->
          <div id="footer">
       <div align="center" class="footer-text">Leet Designs ⓒ 2008 All Rights Reserved</div>
     </div><!-- Footer-->

</div><!-- wrapper -->
</body>
</html>

Css

@charset "utf-8";
/*
*Copyright of Leet Designs 
*/
Body {
font-family: 'Trebuchet MS', Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
color: #f0f0f0;
margin:0;
padding:0;
background-color:#353535;

}
.statement {
font-family: 'Trebuchet MS', Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
color: #f0f0f0;
text-indent:5px;
margin:0;
padding:0;
}
.welcome {
text-indent:5px;
}
#Wrapper {
width: 1000px;
height: auto;
height: 100%;
min-height: 100%;
margin:auto;
}
#content-wrapper {
width:1000px;
height:1027px;
}
#logo {
background:url(images/logo.png) no-repeat;
height:63px;
width:207px;
margin-left:20px;
margin-top:30px;
margin-bottom:10px;
padding:0;
}
/** NAVAGATION **/
#nav {
background: #d61313;
height:51px;
width:999px;
margin:0;
padding-top:2px;
padding-left:0;
padding-bottom:0;
padding-right:0;
position:relative;
}
#nav span {
display: none;
}
#nav li, #nav a {
height:51px;
display:block;
}
#nav li {
float:left;
list-style:none;
display:inline;
}
#nav-divder {
background:url("images/divider.gif") no-repeat;
height:51px;
width:2px;
}

#nav-01 {
background:url("images/Home.png") no-repeat;
width:141px;
height:49px;
}
#nav-02 {
background:url("images/About.png") no-repeat;
height:49px;
width: 141px;
}
#nav-03 {
background:url("images/Templates.png") no-repeat;
height:49px;
width: 141px;
}
#nav-04 {
background:url("images/Services.png") no-repeat;
height:49px;
width: 141px;
}
#nav-05 {
background:url("images/Mydesigns.png") no-repeat;
height:49px;
width: 141px;
}
#nav-06 {
background:url("images/Register.png") no-repeat;
height:49px;
width: 141px;
}
#nav-07 {
background:url("images/Contact.png") no-repeat;
height:49px;
width: 141px;
}
#nav-01 a:hover {background:url("images/Home.png") 0px -49px no-repeat; }
#nav-02 a:hover {background:url("images/About.png") 0px -49px no-repeat; }
#nav-03 a:hover {background:url("images/Templates.png") 0px -49px no-repeat; }
#nav-04 a:hover {background:url("images/Services.png") 0px -49px no-repeat; }
#nav-05 a:hover {background:url("images/Mydesigns.png") 0px -49px no-repeat; }
#nav-06 a:hover {background:url("images/Register.png") 0px -49px no-repeat; }
#nav-07 a:hover {background:url("images/Contact.png") 0px -49px no-repeat; }
/** END NAVAGATION **/

#edge-left {
background:#414141 url(images/lines.gif) repeat-y;
height:898px;
width:12px;
float:left;
}
#edge-right {
background:#414141 url(images/lines.gif) repeat-y;
height:898px;
width:12px;
float:right;
}
#inner-wrapper {
height:509px;
width:1000px;
margin:0;
padding:0;
}
#inner{
background:#3f3e3e;
height:509px;
width:950px;
margin-left:18px;
margin-top:10px;
padding:5px;
}
.inner-header {
background:#464545;
height:34px;
}
#inner-body {
height:503px;
width:944px;
border-style:solid;
border-color:#353535;
}
#bottomdivder {
background:#434343;
height:108px;
width:4px;
}
#note {
background:url(images/note.png) no-repeat;
height:254px;
width:289px;
padding:40px;
z-index:2;
}
.note-p {
color:#000000;
height:15px;
width:170px;
}
.bottom-content {
float:right;
}
#bottom {
background:#3f3e3e;
height:338px;
width:950px;
z-index:1;
margin-top:-108px;
}
#bottom-box1 {
height:30px;
width:90px;
margin-left:94px;
margin-top:-80px;
}
#bottom-box-divider {
background:#434343;
height:321px;
width:4px;
margin-top:6px;
}
.firefox-img {
width:75px;
height:74px;
margin-left:10px;
margin-top:-70px;
}
.photoshop-img {
width:76px;
height:75px;
margin-left:10px;
}

#footer {
background:url(images/stripes.png) repeat-x;
height:97px;
width:auto;
margin:0;
}
.footer-text {
margin-top:50px;
margin-left:360px;
position:absolute;
}

ToonMariner · December 20, 2008

start with some good semantic markup.

Sakesaru · December 24, 2008

http://validator.w3.org/check?uri=www.hackingclan.com%2Fleetdesigns&charset=%28detect+automatically%29&doctype=Inline&group=0

First task is to fix 9 errors.

TheFilmGod · December 25, 2008

You should have a separate page for each section of the website. Using php to dynamically manipulate ONLY ONE page isn't a good idea. It is also poor SEO if pages differ with only a variable in the url.

Sign In

Need clean up help

Recommended Posts

pspfreak101

Link to comment

Share on other sites

ToonMariner

Link to comment

Share on other sites

Sakesaru

Link to comment

Share on other sites

TheFilmGod

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information