Jump to content

Table screwy


Spe92002
 Share

Recommended Posts

Hey again! I am trying to make a nice easy table for my links page. I haven't completed it, however, the table is already screwy. I have tried as many things I could to fix the table. In the browsers it doesn't show the first part, I want the the text to go down and the aligning is all really messed up. If I am just doing a links page, is it necessary to have a table? Or is this more suitable for like an unordered list?Thanks!Here is the code:<table border="0" width="100%"><tr> <td><a href="http://mo.milesplit.us>Mile Split</a><p>We love this site because it has a great perspective ofmissouri high school running. This site includes a nice message board, articles, and everything you needto be caught up with your missouri running.</td></p><br /><br /> <td><a href="www.logarun.com">Logarun</a><p> This site is very popular among ladue high school runners. This site isbest known for it's fabulous log. It is easy access and adds up your weekly mileage for you.</td></p><br /><br /> <td><a href="www.flotrack.com">Flotrack</a> <p>Flotrack is also another running log site. However, it also includes manyrace videos, interviews, and plenty of other great running things.</td></p></tr></table>

Link to comment
Share on other sites

It's not correct to put <br /> tags between <td> tags. And you're closing <td> tags leaving <p> tags open.I don't know exactly how you want it to look, but try using CSS instead.Most likely a definition list is suitable. To add space between these put a bottom margin to the <dd> elements in your CSS stylesheet

<dl><dt><a href="http://mo.milesplit.us>Mile Split</a></dt><dd>We love this site because it has a great perspective ofmissouri high school running. This site includes a nice message board, articles, and everything you needto be caught up with your missouri running.</dd><dt><a href="www.logarun.com">Logarun</a></dt><dd>This site is very popular among ladue high school runners. This site isbest known for it's fabulous log. It is easy access and adds up your weekly mileage for you.</dd><dt><a href="www.flotrack.com">Flotrack</a></dt><dd>Flotrack is also another running log site. However, it also includes manyrace videos, interviews, and plenty of other great running things.</dd></dl>

Link to comment
Share on other sites

Is it possiblt to link to your site so I can see exactly what's happening?
I'll just give the exact code. I don't have my domain name up yet, I am just waiting to set up an account with dreamhost. For now I am just working offline.Right now I am just trying to figure out a way to flow the links smoothly from the left of the page down. With little breaks with in each link.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <title>Ladue Runners</title> <meta http-equiv="Content-Language" content="en-us" /> <meta http-equiv="imagetoolbar" content="no" /> <meta name="MSSmartTagsPreventParsing" content="true" /> <meta name="description" content="Description" /> <meta name="keywords" content="Keywords" /> <meta name="author" content="Spewak Design" /> <style type="text/css" media="all">@import "css/masterpeice1.css1";</style></head><body bgcolor="#cccccc"><CENTER><table border="1"><tr><td><img src="images1/LadueHeader-1.jpg" width="760" height="150" alt="Header" border="0" /></td></tr></CENTER></table><CENTER><table border="1" cellspacing="0" cellpadding="0"><tr> <td><a href="index.htm"><img src="images1/home.jpg"></a></td> <td><a href="media.htm"><img src="images1/media.jpg"></a></td> <td><a href="team.htm"><img src="images1/team.jpg"></a></td> <td><a href="links.htm"><img src="images1/links.jpg"></a></td> <td><a href="news.htm"><img src="images1/news.jpg"></a></td> <td><a href="log.htm"><img src="images1/log.jpg"></a></td> <td><a href="forums"><img src="images1/forums.jpg"></a></td> </tr></div></table><hr align width="100%" noshade><h1 align="center">Links Page</h1><dl><dt><a href="http://mo.milesplit.us>Mile Split</a></dt><dd>We love this site because it has a great perspective ofmissouri high school running. This site includes a nice message board, articles, and everything you needto be caught up with your missouri running.</dd><dt><a href="www.logarun.com">Logarun</a></dt><dd>This site is very popular among ladue high school runners. This site isbest known for it's fabulous log. It is easy access and adds up your weekly mileage for you.</dd><dt><a href="www.flotrack.com">Flotrack</a></dt><dd>Flotrack is also another running log site. However, it also includes manyrace videos, interviews, and plenty of other great running things.</dd></dl></body></html>
Link to comment
Share on other sites

I'm sorry, this code is extremely old fashioned... It's going to be quite hard to fix it all. I'll give you a few pointers, at least. Once you've fixed up your site a little you may be able to find a solution for your problem, because such old code could be the source of many problems.1. Pass your code through the W3C Validator2. Get rid of all your tables and use CSS3. Get rid of <CENTER> tags and use CSS for it instead.4. Remove bgcolor from <body bgcolor="#cccccc"> and use CSS instead5. Change all align, width, and height attributes for CSS6. Change this for an unordered list:

<tr><td><a href="index.htm"><img src="images1/home.jpg"></a></td><td><a href="media.htm"><img src="images1/media.jpg"></a></td><td><a href="team.htm"><img src="images1/team.jpg"></a></td><td><a href="links.htm"><img src="images1/links.jpg"></a></td><td><a href="news.htm"><img src="images1/news.jpg"></a></td><td><a href="log.htm"><img src="images1/log.jpg"></a></td><td><a href="forums"><img src="images1/forums.jpg"></a></td></tr>

Link to comment
Share on other sites

Yeah... I try to use CSS but I am still having trouble learning it. W3schools does a good job teaching but still I need other sources to help. I just need more experience in css. Do any of you have any suggestions of how you learned, or some tutorials that might help me learn css a lot better?Thanks

Link to comment
Share on other sites

Well, I can give a few tips for CSS. You can check the W3Schools reference for what all the properties mean.1. when making menus you usually should use an unordered list, and you usually want a list without bullets, so you use list-style-type: none2. When making a horizontal list you give the <li> elements an inline display.Here's an example of bothHTML:

<ul><li><a href="URL">Link</a></li><li><a href="URL">Link</a></li><li><a href="URL">Link</a></li><li><a href="URL">Link</a></li></ul>

CSS:

ul { list-style-type: none; }ul li { display: inline; } /* Every <li> element that's inside a <ul> element */

3. Apply styles to the body and html elements:

html,body { background-color: #CCCCCC; }

4. Center text and inline elements with CSS:HTML:<div class="center">Some centered text</div>CSS:.center { text-align: center; } /* The "." means you use this with the class attribute */5. Center a box with CSS:HTML:<div class="centered">This box needs to have a fixed width and it is centered.</div>CSS:.centered { margin: 0 auto; width: 500px; } /* It must have a width. The key for centering is the auto margin */

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...