1. This website uses cookies. By continuing to use this website you are giving consent to cookies being used.
    For information on cookies and how you can disable them visit our Cookie Usage page.
    Dismiss Notice

CSS Website Design Help

Discussion in 'Web Development' started by alien13, May 26, 2008.

  1. alien13

    alien13 New Member

    Hey,

    I'm currently redesigning a website and I would like to have it use CSS because my old personal site was so easy to maintain with CSS.
    The main page is as follows:
    Code:
    <html>
<head>
<title>Delta Pi Supplies - Comming Soon!</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="styles.css" type="text/css" />
</head>

<body bgcolor="#333333" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center">
  <center>
  <table border="0" cellpadding="0" cellspacing="0" width="756" height="291" style="border-collapse: collapse" bordercolor="#111111">

  <tr>
   <td width="770" height="1" bgcolor="#7E8079"><img src="images/spacer.gif" width="134" height="1" border="0"></td>
   <td width="510" height="1"><img src="images/spacer.gif" width="15" height="1" border="0"></td>
   <td width="353" height="1"><img src="images/spacer.gif" width="44" height="1" border="0"></td>
   <td width="577" height="1"><img src="images/spacer.gif" width="309" height="1" border="0"></td>
   <td width="142" height="1"><img src="images/spacer.gif" width="17" height="1" border="0"></td>
   <td width="156" height="1"><img src="images/spacer.gif" width="121" height="1" border="0"></td>
  </tr>

  <tr>
   <td colspan="6" bgcolor="#515151" height="119">
    <table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-width: 0" bordercolor="#515151" width="100%" id="AutoNumber4">
        <tr>
        <td style="border-style: none; border-width: medium">
            <div align="center"><img src="images/logo.png" width="373" height="135"></div>
        </td>
        </tr>
    </table>
    </td>
   </tr>
  <tr>
  </tr>
  <tr>
   <td rowspan="2" bgcolor="#717171" valign="top" width="770" height="140">
   <div align="center">
     <center>
     <table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-width: 0" bordercolor="#111111" width="81%" id="AutoNumber1" height="53">
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17"></td>
       </tr>
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17" bgcolor="#555652"><h2>Main Menu</h2></td>
       </tr>
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17" bgcolor="#DCDDDB">
         <p align="center" style="margin: 1 4"><linkh1><a href="/">Home</a></linkh1></td>
       </tr>
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17" bgcolor="#DCDDDB">
         <p align="center" style="margin: 1 4"><linkh1><a href="?page=about_us">About Us</a></linkh1>
         </td>
       </tr>
     </table>
     </center>
   </div>   </td>
   <td align="left" valign="top" height="1" bgcolor="#DCDDDB" width="510">&nbsp;</td>
   <td colspan="2" bgcolor="#DCDDDB" valign="top" width="353" height="1">
   <p style="margin-top: 0; margin-bottom: 0"></td>
   <td align="right" valign="top" height="1" bgcolor="#DCDDDB" width="142">&nbsp;</td>
   <td rowspan="2" bgcolor="#717171" valign="top" height="140" width="156">
   <div align="center" style="width: 156; height: 259">
     <center>
     <!-- Link/News Box -->
     <table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-width: 0" bordercolor="#111111" width="90%" id="AutoNumber2" height="1">
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17"></td>
       </tr>
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17" bgcolor="#555652"><h2>News</h2></td>
       </tr>
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17" bgcolor="#DCDDDB">
         <p align="center" style="margin: 1 4">
         <h3><? include('pages/news.php'); ?></h3>         
         </td>
       </tr>
     </table>
     <p style="margin-top: 0; margin-bottom: 0">&nbsp;</p>
     <!-- Special Textbox -->
     <table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-width: 0" bordercolor="#111111" width="89%" id="AutoNumber3">
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" height="17"></td>
       </tr>
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" bgcolor="#555652"><h2>Specials</h2></td>
       </tr>
       <tr>
         <td width="100%" style="border-style: none; border-width: medium" bgcolor="#DCDDDB">
         <p align="center" style="margin-left: 4; margin-right: 4; margin-top: 1; margin-bottom: 4">
         <h3><? include('pages/specials.php'); ?></h3>
         </td>
       </tr>
     </table>
     <br>
     <p style="margin-top: 0; margin-bottom: 0">&nbsp;</p>
     </center>
   </div>   </td>
  </tr>
  <tr>
   <td colspan="4" bgcolor="#DCDDDB" valign="top" width="510" height="246">
   <table width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#DCDDDB" id="AutoNumber6" style="border-collapse: collapse; border-width: 0">
     <tr>
       <td width="100%" height="24" style="border-style: none; border-width: medium"><h1>Welcome!</h1></td>
     </tr>
     <tr>
       <td width="100%" style="border-style: none; border-width: medium; padding-left:10px; padding-right:10px">
            <p>
              <?
            if (isset($_GET['page']) && is_file('pages/'. basename($_GET['page']) .'.php')) {
                include('pages/'. basename($_GET['page']) .'.php');
            } else {
                include('pages/mainpage.php');
            }
            ?>
              </p>
            </td>
     </tr>
   </table>   </td>
  </tr>
  <tr bgcolor="#7E8079">
   <td width="770" height="12" colspan="6" bgcolor="#717171">&nbsp;</td>
  </tr>
  <tr>
   <td colspan="6" bgcolor="#515151" width="770" height="12">
   <p align="center" style="margin-top: 4; margin-bottom: 4">
    <font face="Arial" size="1" color="#FFFFFF">&copy; 2008 Delta Pi Supplies. All Rights Reserved.    </td>
  </tr>
</table>
  </center>
</div>
</body>
</html>
    And the CSS file:
    Code:
    h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 16pt;
 font-weight: bold;
 color: #333333;
 text-align: center;
}
h2{
 font-family: Verdana,Arial,sans-serif;
 font-size: 8pt;
 font-weight: bold;
 color: #FFFFFF;
 text-align: center;
}

h3{
 font-family: Verdana,Arial,sans-serif;
 font-size: 8pt;
 color: #555652;
 text-align: center;
}
/***** #linkBar *****/
linkh1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 8pt;
 color: #555652;
 text-align: center;
}
/********************/
    If anyone could give me some tips on what I could do to modify the page that would improve it would be greatly appreciated!

    Cheers,
    alien13
     
    alien13, May 26, 2008
    #1
  2. Jaybirddesigns

    Jaybirddesigns New Member

    I don't think i quite understand. Maybe break it down some.
     
    Jaybirddesigns, May 27, 2008
    #2
  3. pezboy45

    pezboy45 Mod/Design & Coder [Pro]

    Yea, what do you exactly want done?
    And a link to the page where this code is being used would be great!
     
    pezboy45, May 27, 2008
    #3
  4. alien13

    alien13 New Member

    Hey,

    Ok. So here is my site:
    http://alien13.web44.net/main.php
    and here is where the other site is currently hosted:
    http://dps.alien13.web44.net/

    I basically want to have the second site use CSS as much as possible like my personal site.

    Hope that makes sense, if not give a shout and I'll try again!
    -alien13
     
    alien13, May 28, 2008
    #4