Borders Help (table)

[Stinky666]

Ok so, it's my Info Center:
exdat.freeforums.net/

See the stats bit, where it's 4 TD's (last post info + post info + member info + boards info). How come there is no inner border separating them all?
I really really don't know what I have done wrong to not have them

Much appreciated.

[Brian]

Inner borders are only given to tables with the class list.

<table class="list">
    <tr>
        <td></td>
        <td></td>
        <td class="last"></td>
    </tr>
    <tr class="last">
        <td></td>
        <td></td>
        <td class="last"></td>
    </tr>
</table>

[Stinky666]

Apr 16, 2013 8:59:15 GMT -8 Brian said:

Inner borders are only given to tables with the class list.

<table class="list">
    <tr>
        <td></td>
        <td></td>
        <td class="last"></td>
    </tr>
    <tr class="last">
        <td></td>
        <td></td>
        <td class="last"></td>
    </tr>
</table>

Ohhhhhh right ok.
I suck with tables, as we know, so I thought it was a case of me not closing something, or not opening something or god only knows what else lol.


Which ever Table I give it to (or multiple), it messes up and leaves gaps
For example:
(i have saved this so you can see what I mean)

<td class="info" style="padding-left: 11px;">
<table class="list">
<tr>
                                   <td width="34%">
<table>
<tbody>
{if $[last_updated_thread]}<tr><td><b>Last Topic:</b> $[last_updated_thread.recent_link]
                                               <br /><b>Updated by:</b> $[last_updated_thread.last_post.created_by_user]
                                               <br /><b>When:</b> $[last_updated_thread.last_post.date]</td></tr>{/if}
</tbody>
</table>
</td>
<td width="23%">
<table>
<tbody>
<tr><td><b>Topics:</b> $[total_threads]
                                               <br /><b>Posts:</b> $[total_posts]
                                                   <br /><a href="$[recent_posts_link.href]">Most Recent Posts</a></td></tr>
</tbody>
</table>
</td>
                                   <td width="18%">
<table>
<tbody>
<tr><td><b>Categories:</b> $[category.length]
                                               <br /><b>Boards:</b> <script type="text/Javascript">document.write($(".board").length);</script>
                                               <br /><b>Sub-Boards:</b> <script type="text/Javascript">document.write($(".sub-boards a").length);</script></td></tr>
</tbody>
</table>
</td>
                                   <td width="25%">
<table>
<tbody>
<tr><td><b>Members:</b> $[total_members]
                                               <br /><b>Newest:</b> $[newest_user]
                                               <br /><a href="#" class="admlegend" title="Administrator"><div id="squareAdm"></div></a> <a href="#" class="gmodlegend" title="Global Moderator"><div id="squareGMod"></div></a> <a href="#" class="modlegend" title="Moderator"><div id="squareMod"></div></a> <a href="#" class="memlegend" title="Member"><div id="squareMem"></div></a></td></tr>
</tbody>
</table>
</td>
</tr>
</table>
</td>
</tr>

[Brian]

Which gaps are you referring to specifically?

For the record, your table is inside an element with padding, so they're not going to touch the rest of the borders.

[Stinky666]

Apr 16, 2013 10:50:43 GMT -8 Brian said:

Which gaps are you referring to specifically?

For the record, your table is inside an element with padding, so they're not going to touch the rest of the borders.

You don't see the double bottom border? And the borders for the 4 columns don't touch the tops and the bottom border of it doesn't touch the sides.
However, the padding explains that. Just not sure how to give those a padding, but have the borders touch the sides correctly..

[Brian]

Rather than adding your items as a brand new table inside the existing table, why not add the new table's <td> elements into a row in the existing table? I imagine that would solve a lot of the border issues.

[Stinky666]

Apr 16, 2013 11:33:32 GMT -8 Brian said:

Rather than adding your items as a brand new table inside the existing table, why not add the new table's <td> elements into a row in the existing table? I imagine that would solve a lot of the border issues.

Because I'm really not good with tables haha.
I just do "trial and error" work, and hope for the best.

[Stinky666]

Could you elaborate on your way to solve/fix this? I honestly don't know how you mean, maybe an example ?

[Brian]

This table.

    <div class="container stats">
        <div class="title-bar"></div>
        <div class="content">
            <table>
                <tbody>
                    <tr>
                        <td class="info last">
                            <table>
                                <tr>
                                    <td width="20%">
                                        <table>
                                            <tbody>
                                                <tr><td><b>Members:</b> $[total_members]
                                                <br /><b>Newest:</b> $[newest_user]
                                                Etc...

Make it a part of the table that comes before it, rather than a new table.

    <div class="container stats">
        <div class="title-bar"></div>
        <div class="content">
            <table>
                <tbody>
                    <tr>
                        <td width="20%">
                            <table>
                                <tbody>
                                    <tr><td><b>Members:</b> $[total_members]
                                    <br /><b>Newest:</b> $[newest_user]
                                    Etc...

[Stinky666]

I promise I did it all correct, or I thought anyway, and it's made the borders come back but then it makes all the information vertical and the majority of it pushed to the right hand side

[Brian]

Not sure what you mean. Do you have a before and after for comparison?

[Stinky666]

Apr 18, 2013 10:31:21 GMT -8 Brian said:

Not sure what you mean. Do you have a before and after for comparison?

<div class="container stats">
<div class="title-bar"></div>
<div class="content">
<table>
<tbody>
<tr>
<td class="info last">
<table>
<tr>
<td width="20%">
<table>
<tbody>
<tr><td><b>Members:</b> $[total_members]
<br /><b>Newest:</b> $[newest_user]

I'm removing those 3, and the corresponding ones in the bottom (closing tags).


I've left the coding as it is for now (with the changes I have made), it's the ED v2 theme:
exdat.freeforums.net/

[Brian]

Lines 1273 and 1285 of your style sheet have width declarations interfering with your table that you need to get rid of.

[Stinky666]

But that's the default PB Info Center stuff, which I haven't touched
I commented it out, and you were right.
I guess I will try figure that out

No border now though I have commented it out haha.
It is back to normal looking at least

[Brian]

Did you comment out the entire line or just the width declarations?