• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

basic HTML table help

Ryan Kent

Well-known member
#1
I just learned how to make tables in HTML. I am trying to build an organized index for my Wiki (XenCarta). I have the table set up and have two formatting issues I just can't seem to get past. I am hoping someone can point out the error of my ways.

The issues are:

1. The bullet points from the list should be contained within the frame. Basically, they should be shifted a few pixels to the right. I have tried modifying the cellpadding, adding char/charoff and it doesn't have any effect.

2. The spacing between the rows is far too big. I need to reduce the vertical spacing.

I've come a long way with my HTML understanding but I am still in the noobie category.
 

Ryan Kent

Well-known member
#3
Yikes! I just realized I didn't paste my code in the original post. Without it this thread doesn't make much sense.

And yes, I use the W3 site a lot. It's one of two sites I depend on for my HTML information.

Code:
<p>
<thead>
<table border=1 cellpadding=3 cellspacing=1 frame=box>
<th width="50%"><center>Continents</center></th><th width="50%"><center> Stats</center></th>
</thead>
</table>

<table border=1 cellpadding=3 cellspacing=1 rules=cols frame=box>
<ul>
<tr><td width="50%" style="text-align:left"><li><a href="/wiki/arun">Arun</a></li></td><td width="50%" style="text-align:left"><li><a href="/wiki/attack_speed">Attack Speed</a></li></td></tr>

<tr><td width="50%" style="text-align:left"><li><a href="/wiki/northern_shara">Northern Shara</a></li></td><td width="50%" style="text-align:left"><li><a href="/wiki/critical_hit">Critical Hit</a></li></td></tr>

<tr><td width="50%" style="text-align:left"><li><a href="/wiki/southern_shara">Southern Shara</a></li></td><td width="50%" style="text-align:left"><li><a href="/wiki/damage">Damage</a></li></td></tr>

<tr><td width="50%" style="text-align:left"><li><a href="/wiki/island_of_dawn">Island of Dawn</a></li></td><td width="50%" style="text-align:left"><li><a href="/wiki/defense">Defense</a></li></td></tr>
</align></ul></table>
 

Brogan

XenForo moderator
Staff member
#4
Well the first thing I can see is you've got your table rows inside the <ul> list tags.
I don't think I've seen that done before, try putting the complete ul/li element inside the cell.

Out of interest, why are you doing list elements in a table?
 

Ryan Kent

Well-known member
#5
What I am trying to achieve is a nice looking Wiki index page where users can find the categories they seek in an organized manner. I followed Jaxel's example and I completed the top half of my page. For the bottom half (this table) I am using an example I have seen at the bottom half of this page --> http://tera.zam.com/wiki/TERA

I am guessing that table is dynamically generated based on a database, but I don't have those coding skills as of yet so I need to start somewhere. The bullet points are there purely for cosmetic purposes.
 

Ryan Kent

Well-known member
#9
thank you again Brogan. I am learning, and while this is to support my forums I understand this thread is outside the norm for XF support. I very much appreciate the education. I may ask dumb questions, but never the same one twice ;)