Table Trouble
lol...i feel foolish...i can't get the text that says "text" to move to the more middle section of the page...i give up:
the tables:
<!-- Begin Whole Page Table --><table class="whole">
<tr>
<td colspan="2">
<!-- Begin Top Table --><table class="top2">
<tr>
<td class="centerwhite"><img src="/img/logo.gif" alt="[...]" />
</td>
</tr>
<tr>
<td>
<!-- Begin Nav Bar --><table class="top">
<tr>
<td class="header"><a class="header" href="/home.html" alt="[Home]">Home</a></td><td class="header"><a class="header" href="/projects.html" alt="[Projects]">Projects</a></td>
<td class="header"><a class="header" href="/packages.html" alt="[Packages]">Packages</a></td><td class="header"><a class="header" href="/contact.html" alt="[Contact]">Contact</a></td>
<td class="header"><a class="header" href="/about.html" alt="[About Us]">About</a></td>
</tr>
<!-- End Nav Bar --></table>
</td>
</tr>
<!-- End Top Table --></table>
</td>
</tr>
<tr>
<td>
<!-- Begin Bottom Table --><table class="bottom">
<tr>
<td>
<!-- Begin Left Nav Bar --><table class="nav">
<tr>
<td colspan="2"><h1 class="nav">Customer Login:</h1></td>
</tr>
<tr>
<td><p><form method="post" path="/php/login.php">
Username:</p></td><td><input type="text" maxlength="20" name="username" size="14" />
</td>
</tr>
<tr>
<td><p>Password:</p></td><td><input type="password" maxlength="15" name="password" size="15" />
</td>
</tr>
<tr>
<td class="center" colspan="2"><input type="submit" value="Login" name="submit" /></form>
</td>
</tr>
<tr>
<td class="right" colspan="2"><h1 class="forgot">Forgot your <a class="forgot" href="/forgot.html" alt="[Forgot your password?]">password?</a></h1>
</td>
</tr>
<!-- End Left Nav Bar --></table>
</td>
<td>
<!-- Begin Body Table --><table class="body">
<tr>
<td>
<p>Test</p>
</td>
</tr>
<!-- End Body Table --></table>
</td>
</tr>
<!-- End Bottom Table --></table>
</td>
</tr>
<!-- End Whole Page Table --></table>the corresponding CSS can be found at http://westernciv.sarvihosting.com/special.css
thanks
Suzanne posted this at 03:56 — 14th August 2003.
She has: 5,507 posts
Joined: Feb 2000
What a blatant misuse of tables! No wonder you can't do anything with it!
You need to simplify this considerably. The tables are nested far too deeply to do what you want to do.
<!-- Begin Whole Page Table -->
<table class="whole" width="100%">
<tr>
<td colspan="2" align="center">
<!-- Begin Top Table -->
<img src="/img/logo.gif" alt="[...]" />
<a class="header" href="/home.html" alt="[Home]">Home</a>
<a class="header" href="/projects.html" alt="[Projects]">Projects</a>
<a class="header" href="/packages.html" alt="[Packages]">Packages</a>
<a class="header" href="/contact.html" alt="[Contact]">Contact</a>
<a class="header" href="/about.html" alt="[About Us]">About</a>
</td>
</tr>
<tr>
<td width="250">
<h1 class="nav">Customer Login:</h1>
<form method="post" path="/php/login.php">
<p>Username: <input type="text" maxlength="20" name="username" size="14" /><br />
Password: <input type="password" maxlength="15" name="password" size="15" /><br />
<input type="submit" value="Login" name="submit" /></p>
</form>
<p class="forgot">Forgot your <a class="forgot" href="/forgot.html" alt="[Forgot your password?]">password?</a></p>
</td>
<td valign="top">
<p>Test</p>
</td>
</tr>
<!-- End Whole Page Table -->
</table>
I added in HTML to make it work, you'd just have to make that CSS instead.
If you really need more structure in the document, try using around the content elements that need it, not extra tables.
By deleting all your table.whatever CSS, this code works far better. It was the navigation at the top causing the biggest problem, btw.
Suzanne posted this at 03:58 — 14th August 2003.
She has: 5,507 posts
Joined: Feb 2000
Also, you shouldn't use heading elements like that. They are for content headings, not making the text bigger.
kb posted this at 18:01 — 15th August 2003.
He has: 1,380 posts
Joined: Feb 2002
lol thanks
i didn't know that H1/H2..etc were only for headings, i thought it was just another element to use
Suzanne posted this at 18:14 — 15th August 2003.
She has: 5,507 posts
Joined: Feb 2000
I'm a mite grumpy on the bloated code aspect, apologies for my harsh tone.
Yes, they are only for headings. If you use them for other uses, you'll mess up alternative readers. If you need special tags, use or , depending if you need it to be inline or block level, respectively.
kb posted this at 01:23 — 16th August 2003.
He has: 1,380 posts
Joined: Feb 2002
well the "bloated code" was not by accident.
i left that in there because i intend to add other things in, and they were the framework, but i can add them in as i go
Suzanne posted this at 01:24 — 16th August 2003.
She has: 5,507 posts
Joined: Feb 2000
Specifically, you don't need a table cell for each link. That's bloated code. Also not for each item in the body -- those are better served with semantic markup and DIVs.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.