HTML Code Help

DregondRahl · #1 Jun 28th, 2007, 09:46

Here is my first proper code, its an affiliate box. I coded it from scratch

<!-- 
Created by (¯`•Stormraven•._) Copyright 2007 
This code may not be redistributed or reposted without permission from the creator. This header must stay intact at all times 
-->
<table width="700" align="center" class="bordercolor" cellpadding="4" cellspacing="1">
<tr>
<td align="center" class="titlebg" colspan="3">
<font size="2"><center><b>Affiliate Centre</b></center></font>
</td>
</tr>
<tr>
<td width="10%" vAlign="top" class="windowbg">
<a href="<A href="http://forums.pbxtras.com"><img">http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" border="0"></a>
<a href="URL to Affiliate Thread"><center>Affiliate</center></a>
<td width="40%" class="windowbg2" vAlign="top">
<marquee direction="left" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="3">

<!-- Start of Left Marquee Box -->
<a href="<A href="http://forums.pbxtras.com"><img">http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" border="0"></a>
<a href="<A href="http://forums.pbxtras.com"><img">http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" border="0"></a>
<a href="<A href="http://forums.pbxtras.com"><img">http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" border="0"></a>
<!-- End of Left Marquee Box -->

<td width="40%" class="windowbg2" vAlign="top">
<marquee direction="right" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="3">

<!-- Start of Right Marquee Box -->
<a href="<A href="http://forums.pbxtras.com"><img">http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" border="0"></a>
<a href="<A href="http://forums.pbxtras.com"><img">http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" border="0"></a>
<a href="<A href="http://forums.pbxtras.com"><img">http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" border="0"></a>
<!-- End of Right Marquee Box -->
<td width="10% class="windowbg" vAlign="top">
We are currently <b>accepting</b> affiliates

</marquee>
</td>
</tr>
</table>

If you go and have a look here, look at the bottom of the forum and look at the box on the right of the affiliate table, why is the right cell all black? I cant work it out.
I want the box on the far left and the box on the far right exactly the same size, and the two boxes in the middle where the affiliates are moving want them the same size too.
Also is the html coding ok? Or can it be cleared up a bit :-/
EDIT: Am I aloud to copyright this code to myself, because its only small bit of html?

Lchad · #2 Jun 28th, 2007, 11:29

You have 35 errors in code:
h ttp://validator.w3.org/check?uri=http%3A%2F%2Fwww.stormstest.proboards98. com%2F

Some are related to that particular table you are having trouble with. If you fix those errors you'll most likely fix your problem.

You need a doc type too!

BGarner · #3 Jun 28th, 2007, 14:06

It's great that your hand-coding, but I would say if you're just learning, go ahead and start with CSS (Cascading Style Sheets).

I redid your code with CSS it looks like this...

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>table test</title>

        <meta http-equiv="content-language" content="en" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <link rel="stylesheet" type="text/css" media="screen" href="/css/affiliate.css" id="default" title="affiliate css" />

</head>

<body>
<div id="wrapper">

  <h2>Affiliate Centre</h2>
  
  <div class="sidebox">
    <p><a href="http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" class="noborder" alt="pbxtras" /></a></p>
    <p class="center"><a href="URL to Affiliate Thread">Affiliate</a></p>
  </div>
  
  <div class="marquee">
    
    <!-- Start of Left Marquee Box -->
    <p><a href="http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" class="noborder" alt="pbxtras" /></a></p>
    <!-- End of Left Marquee Box -->
  </div>
  
  <div class="marquee">
    
    <!-- Start of Right Marquee Box -->
    <p><a href="http://forums.pbxtras.com"><img src="http://pbxtras.com/forums/affiliate1.png" class="noborder" alt="pbxtras" /></a></p>
    <!-- End of Right Marquee Box -->
  </div>
  
  <div class="sidebox">
    <p>We are currently <strong>accepting</strong> affiliates.</p>
  </div>

</div>
</body>
</html>

and the CSS file (affiliate.css) looks like this...

Code: Select all

  * {
  margin: 0;
  padding: 0;
  }
  
  h2 {
  text-align: center;
  padding-bottom: 20px;
  }
  
  div#wrapper {
  width: 700px;
  margin: 0 auto;
  }
  
  .marquee {
  width: 250px;
  float: left;
  border: solid 1px #000;
  }
  
  .sidebox {
  width: 90px;
  float: left;
  border: solid 1px #000;
  }
  
  .noborder {
  border: none;
  }
  
  .center {
  text-align: center;
  }

This page can be found at www.thehtmldude.com/table.html

The code validates CSS and XHTML Strict. (I took out the marquees so that it would validate.)

Hope this helps you see what can be done with CSS. Look into it, I think CSS is easier than tables. Some great tuorials are www.w3schools.com and www.htmldog.com

Lchad · #4 Jun 28th, 2007, 20:02

Nice job BGarner! You get the daily post award!

whiteknig863 · #5 Jul 11th, 2007, 00:20

Alot of errors with your code...

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
[code], [html], [php]	CloudedVision	Webforumz Suggestions and Feedback	2	Feb 20th, 2008 23:01
HTML Code - Help Please Anyone?	nuddy	Starting Out	14	Apr 24th, 2007 10:05
How I convert Html code to pDF	vijiljones	Web Page Design	2	Oct 11th, 2006 13:57
html code help	Aaron1988	Web Page Design	3	Aug 22nd, 2006 09:52
i need an html code...	anderson10	Web Page Design	8	Jul 31st, 2006 14:13

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
HTML Code Help