Seemingly padded/margined table - can't work out why

[blueuniverse]

First off the site is at blueuniverse.co.uk/livetemplates-revamp/ (I don't want it linked to, in order to avoid dupe content bleurgh when I switch it to a domain)

Secondly, apologies for it not being xhtml and css compatible. As you may have noticed I'm working my way down and skinning something that was originally poor html.

The problem itself occurs in both firefox and IE. It seems incredibly simple, but for the life of me I can't work it out and it's bugging me a lot. Basically, the tables seem to have attained some sort of padding or margin at the top. How, I'm not entirely sure as specifying them as 0 seems to do nothing. Might be way off the mark.

Just to give you an example of where the tables should lie, I've put a bit of text entitled 'some text'. They should be on that line. (That little piece of text isn't causing any problems on itself and if you remove it, the design looks exactly the same bar it.)

Changing the top command brings the whole area up, including that background border at the side. The problem still remains with the tables not appearing right at the top as they should. Again, adding padding or margin 0 to the div makes no difference.

Appreciative of any help,
Ed

[VIPStephan]

This maybe...?


<div id="mainarea">some text<table width="390" cellpadding="0" cellspacing="0" style="padding-left:25px"><tr>
<br /><td width="170" align="center" ...

[blueuniverse]

Good call on that, didn't even know it was being called up but alas, the problem remains.

[VIPStephan]

You know, even though you might be aware of the fact that your code isn't quite semantic (and with currently 395 errors (http://validator.w3.org/check?uri=http%3A%2F%2Fblueuniverse.co.uk%2Flivetemplates-revamp%2F) far away from being valid XHTML (plus 4 CSS errors)) you should really start from scratch with this page (I mean scrap that current one and start new).
Looking at it it seems to be a really simple layout which can be done with a fraction of the code you have now.
But well... anyway. In such cases I'm glad I'm using Dreamweaver and it shows that it can be really useful.
Actually it would have been better to post the PHP code as this would probably have been easier to figure out but after searching a while I found the issue:


<td width="100%" align="center" height="40" colspan="2" style="font-size:10px;">Price - <span style="color:#ff9900">$58.50</span><br />Exc. Price - $2400.00</td>
</tr>
</table>
</td><br /><br /><strong>
</tr></table>
<table width="390" cellpadding="0" cellspacing="0" style="padding-left:25px"><tr>


Two line breaks and an open strong tag (and missing closing tag) that, if removed, fix the issue.

Some advice if you encounter more such problems: Look closer to the elements that are causing the problem and locate the issue step by step by deleting unnecessary code (like images etc.) within the element and in the end you'll find what was wrong.
I trimmed the code down until I had the empty table (temp. background colors and/or borders help seeing the tags) and then I deleted the redundant code after the table that was causing the gap before the table... weird but it must be somwhere in the PHP as this code is repeating.

Well, I hope I didn't bore you with all my talking and clever advices :) I'm sure you are aiming to get this page clean and valid. Good luck. ;)

[blueuniverse]

Thanks, that worked perfectly. Honestly, I'm sorry about all those nasty errors they'll go away eventually. It's probably hard to fathom looking at them but I'm actually fairly good at coding to standards but the initial base I had to work on (it's a script that I'm designing into) it has been close to impossible.

For example, the table usage in that instance is unavoidable because of the way it's coded. Annoying, yes but I have to live with it.

You're right about the php code and I think that's where the problem has originated in both instances. It's a templated script and whilst everything else is in the templates those <br /> tags have remained in the script itself, hence when I looked through it locally, nothing came up.

Thanks for the response, and the size will be reduced dramatically. Everything in that table below the layout will be removed, I've just left it there so I have the codes to call up certain elements. It reduces it to about 4kb or 5kb in pagesize, once that is all gone. Needless to say though, converting a table based poor html coded script to an xhtml tableless design is nigh on impossible, I'll persist though.

Thanks again,
Ed