some help with a php site with txt and a side nav

krrose27

Im making a site for my sisters model un club at her high school. I used fireworks to make a top bar and side nave bar, and exported the sliced stuff through it. Im now incoporiating php to make it do everything the problem is that wher i want it to type i want it to start at the top and not the middle. Here is the links to my two diffrent tests and my code:
link1: http://krrose27.com/mun/index.php?user=bob
link2: http://krrose27.com/mun/index1.php?user=bob
my code for the first one:

<?php
// added for the post only
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">td img {display: block;}</style>
</head>
<body bgcolor="#ffffff">
<table border="0" cellpadding="0" cellspacing="0" width="728">
  <tr>
   <td><img src="spacer.gif" width="5" height="1" border="0" alt="" /></td>
   <td><img src="spacer.gif" width="119" height="1" border="0" alt="" /></td>
   <td><img src="spacer.gif" width="6" height="1" border="0" alt="" /></td>
   <td><img src="spacer.gif" width="598" height="1" border="0" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
  </tr>

  <tr>
   <td colspan="4"><img name="border_r1_c1" src="border_r1_c1.gif" width="728" height="40" border="0" id="border_r1_c1" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="40" border="0" alt="" /></td>
  </tr>
  <tr>
   <td colspan="2"><img name="border_r2_c1" src="border_r2_c1.gif" width="124" height="3" border="0" id="border_r2_c1" alt="" /></td>
   <td rowspan="16"><img name="border_r2_c3" src="border_r2_c3.gif" width="6" height="723" border="0" id="border_r2_c3" alt="" /></td>
   <td><img name="border_r2_c4" src="border_r2_c4.gif" width="598" height="3" border="0" id="border_r2_c4" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="3" border="0" alt="" /></td>
  </tr>
  <tr>
  <td colspan="2"><img name="border_r3_c1" src="border_r3_c1.gif" width="124" height="167" border="0" id="border_r3_c1" alt="" /></td>
   <td rowspan="15">
   <?php
if($_GET['user'])
{
	switch($_GET['user'])
	{
		case bob:
			echo "Hello bob";
		break;
		case kelly:
			echo "hello kelly";
		break;
	}
}
?>
</td>
   <td><img src="spacer.gif" width="1" height="167" border="0" alt="" /></td>
  </tr>
  <tr>
   <td rowspan="14"><img name="border_r4_c1" src="border_r4_c1.gif" width="5" height="553" border="0" id="border_r4_c1" alt="" /></td>
   <td><img name="border_r4_c2" src="border_r4_c2.gif" width="119" height="30" border="0" id="border_r4_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="30" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r5_c2" src="border_r5_c2.gif" width="119" height="10" border="0" id="border_r5_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="10" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r6_c2" src="border_r6_c2.gif" width="119" height="30" border="0" id="border_r6_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="30" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r7_c2" src="border_r7_c2.gif" width="119" height="10" border="0" id="border_r7_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="10" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r8_c2" src="border_r8_c2.gif" width="119" height="30" border="0" id="border_r8_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="30" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r9_c2" src="border_r9_c2.gif" width="119" height="10" border="0" id="border_r9_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="10" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r10_c2" src="border_r10_c2.gif" width="119" height="30" border="0" id="border_r10_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="30" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r11_c2" src="border_r11_c2.gif" width="119" height="10" border="0" id="border_r11_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="10" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r12_c2" src="border_r12_c2.gif" width="119" height="30" border="0" id="border_r12_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="30" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r13_c2" src="border_r13_c2.gif" width="119" height="10" border="0" id="border_r13_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="10" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r14_c2" src="border_r14_c2.gif" width="119" height="30" border="0" id="border_r14_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="30" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r15_c2" src="border_r15_c2.gif" width="119" height="10" border="0" id="border_r15_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="10" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r16_c2" src="border_r16_c2.gif" width="119" height="30" border="0" id="border_r16_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="30" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="border_r17_c2" src="border_r17_c2.gif" width="119" height="283" border="0" id="border_r17_c2" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="283" border="0" alt="" /></td>
  </tr>
</table>
</body>
</html>

_theworks

Iv'e sed it b4 ill say it again. Dont use tables as the foundation of a layout. tables where intended for tables of infomation. Use Xhtml and CSS....

_theworks

try somthing like this....

<div id="body_wrap">
    <div id="page_head">
        <h1>Page header</h1>
    </div>
    <div id="page_wrap">
        <div id="nav">
            <ul>
                <li>home</li>
                <li>links</li>
            </ul>
        </div>
        <div id="content">
        <h1>Hello! welcome!</h1>
        <p>hello, hello welcome to my site.</p>
        </div>
    </div>

</div>

and the CSS...

#body_wrap {
       position:relative;
       margin: auto;
       padding: 25px;
       width: 600px;
       background-color: #115c06;
}
 #page_head {
            position: relative;
            width: 600px;
            height: 100px;
            background-color: #328c25;
}
#page_wrap {
             position: relative;
             width: 600px;
             background-color: #5db750;
}
#nav {
          position: absolute;
          left: 450px;
          width: 150px;                            

          background-color: #328c25;
}
#content {
        position: relative;
        width: 450px;
        background-color: #538e4b;
}

P.S this is just quick mockup. ( i didnt acctually test it .. but it should work...)

krrose27

can u explain the html stuff and what i do with the css?
edit: Like how do i add my images?

_theworks

Ok im not gona go very far into this cuz i gota go cut the grass (if you know what i mean 😉 ) neway. Html is supposed to be coded semantically so like use the elements for what they were intended for. like you want a paragraph of text use the <p> element. you want a list of infomation use either the <ol> or the <ul> element,
you want a table of infomation? use a <table> element.

You get what im saying here? if not google "html semantics tutorial", infact do it anyway.

Ok now CSS stands for Cascading Style Sheet's.

think of it like this. Html is for defining the documents structure. whereas CSS is for stylizeing the Html (creating a visual aspect...)

ok now this is a good site HtmlDog.com

use it for a reference of HTML and CSS as it has list of html elements and examples of their use and it also has an entire property's reference for CSS 😃

hope this helps.