Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Table not displaying correctly WordPress

  • SOLVED

Hi Guys

Probably a simple question for you guys but I can't get a table to display correctly.

My site is http://socialmediainbusiness.com

and the table is in the free members area,

http://socialmediainbusiness.com/members/tools/tools-2

all you need is your name and email to get access...if you need that information


what I need to correct is:

1. It to display correctly (see attached - the one with the red line around is how it is supposed to be)
2. I want to be able to centre the headings over the columns



The html code is:

<table style="background-color: #ffffcc;" width="400" border="2" cellspacing="3" cellpadding="3">
<tbody>
<tr>
<td><strong>PAGE....</strong></td>
<td><strong>.........FREE TOOL</strong></td>
<td><strong>DOWNLOAD LINK</strong></td>
</tr>
<tr>
<td>34</td>
<td><span style="color: #0000ff;">Case studies database</span></td>
<td><span style="color: #0000ff;">See 2 below</span></td>
</tr>
<tr>
<td>144</td>
<td><span style="color: #0000ff;">Social media policy examples</span></td>
<td><span style="color: #0000ff;">See 3 below</span></td>
</tr>
<tr>
<td>155</td>
<td><span style="color: #0000ff;">SWOT and PEST Analysis</span></td>
<td><span style="color: #0000ff;"><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/SWOTandPESTanalysis.pdf" target="_blank"><span style="color: #0000ff;">Click Here</span></a></span></td>
</tr>
<tr>
<td>174</td>
<td><span style="color: #0000ff;">Social Media Audit - checklist</span></td>
<td><span style="text-decoration: underline;"><span style="color: #0000ff; text-decoration: underline;"><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/AnalysisChecklist.pdf" target="_blank"><span style="color: #0000ff; text-decoration: underline;">Click Here</span></a></span></span></td>
</tr>
<tr>
<td>177</td>
<td><span style="color: #0000ff;">Checklist of questions and other considerations</span></td>
<td><span style="text-decoration: underline;"><span style="color: #0000ff; text-decoration: underline;"><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/BusinessOpportunitiesQuestions.pdf" target="_blank"><span style="color: #0000ff; text-decoration: underline;">Click Here</span></a></span></span></td>
</tr>
<tr>
<td>180</td>
<td><span style="color: #0000ff;">What are Milestones?</span></td>
<td>Coming soon</td>
</tr>
<tr>
<td>188</td>
<td><span style="color: #0000ff;">Project Review – Checklist</span></td>
<td><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/ProjectReview.pdf" target="_blank">Click Here</a></td>
</tr>
</tbody>
</table>
<span style="color: #ff0000;">Coming this week ...</span>

Answers (2)

2012-01-12

Julio Potier answers:

Hello !
Me again :)

There is no file attached !


Julio Potier comments:

(as last time, i can do this on your webiste;) )

So you can add an ID to the table like this :
<table style="background-color: #ffffcc;" width="400" border="2" cellspacing="3" cellpadding="3" id="the_table">
than you can add a THEAD instead of TBODY
like this :
<thead>
<td>PAGE</td>
<td>FREE TOOL</td>
<td>DOWNLOAD LINK</td>
</thead>

and after you can really write the table body in a tbody.

Now we can select the td in the thead on CSS and to this :
#the_table thead td {
font-weight: bold;
text-align: center;
}


Full code :
<table id="the_table" style="background-color: #ffffcc;" width="400" border="2" cellspacing="3" cellpadding="3">
<thead>
<tr>
<td>PAGE</td>
<td>FREE TOOL</td>
<td>DOWNLOAD LINK</td>
</tr>
</thead>
<tbody>
<tr>
<td>34</td>
<td><span style="color: #0000ff;">Case studies database</span></td>
<td><span style="color: #0000ff;">See 2 below</span></td>
</tr>
<tr>
<td>144</td>
<td><span style="color: #0000ff;">Social media policy examples</span></td>
<td><span style="color: #0000ff;">See 3 below</span></td>
</tr>
<tr>
<td>155</td>
<td><span style="color: #0000ff;">SWOT and PEST Analysis</span></td>
<td><span style="color: #0000ff;"><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/SWOTandPESTanalysis.pdf" target="_blank"><span style="color: #0000ff;">Click Here</span></a></span></td>
</tr>
<tr>
<td>174</td>
<td><span style="color: #0000ff;">Social Media Audit - checklist</span></td>
<td><span style="text-decoration: underline;"><span style="color: #0000ff; text-decoration: underline;"><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/AnalysisChecklist.pdf" target="_blank"><span style="color: #0000ff; text-decoration: underline;">Click Here</span></a></span></span></td>
</tr>
<tr>
<td>177</td>
<td><span style="color: #0000ff;">Checklist of questions and other considerations</span></td>
<td><span style="text-decoration: underline;"><span style="color: #0000ff; text-decoration: underline;"><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/BusinessOpportunitiesQuestions.pdf" target="_blank"><span style="color: #0000ff; text-decoration: underline;">Click Here</span></a></span></span></td>
</tr>
<tr>
<td>180</td>
<td><span style="color: #0000ff;">What are Milestones?</span></td>
<td>Coming soon</td>
</tr>
<tr>
<td>188</td>
<td><span style="color: #0000ff;">Project Review – Checklist</span></td>
<td><a title="Click Here" href="https://smibt.s3.amazonaws.com/Book tools download/ProjectReview.pdf" target="_blank">Click Here</a></td>
</tr>
</tbody>
</table>
<span style="color: #ff0000;">Coming this week ...</span>


Julio Potier comments:

<em>edit last comment :
then you can add a THEAD instead of TBODY
like this :
<thead>
<tr>
<td>PAGE</td>
<td>FREE TOOL</td>
<td>DOWNLOAD LINK</td>
</tr>
</thead>
</em>


Bookinars comments:

Hi Julio

Yes I would appreciate you doing that for my site

What do you need?

My email is: [email protected]

As you can see I'm trying to create an attractive table with some download links...but I do not understand the CSS part.

So the table comes out like the attached screen who, instead of the correct way which I added to the main question



Kind regards
Steve