My table elements are too wide

  effingpot 21:10 05 Feb 06
Locked

Hi,
I designed a web site and had a friend make the code for me using server side includes and stylesheets to get me going.

The main body (click here) is all in an 800 wide table which looks fine in IE. However I recently started using firefox and it looks terrible. I think the width of the embedded tables are wider than the 800 maximum.

So my question is - assuming anyone thinks I've spotted the error, is there a tool that will help me fugure out the table errors as I can't seem to do it with 8 pages of html printed out in front of me.

Or if the problem looks like something else, any help would be appreciated.
Thanks
Mike

  harristweed 22:01 05 Feb 06

and I.E.7.

Sorry, but can't see any problems!

  beynac 22:28 05 Feb 06

I can't see any problems using Firefox.

  PurplePenny 23:08 05 Feb 06

What looks different to you in Firefox? What about Opera? Aside from the background colour (see below) it looks the same in all three to me.

There is no background colour for the page/body in the stylesheet so in IE and Opera I see a strange looking page with patches of white on a lilac background. (Lilac is my system background which Opera and IE default to when no page/body background is specified.)

  Forum Editor 23:33 05 Feb 06

in both FireFox and the beta version of IE7, and there's absolutely no difference at all.

In all cases the pages look identical.

  effingpot 08:18 06 Feb 06

The single pixel wide black box that frames the central part of the page - where all the content goes - is missing down the left hand side in FF but not in IE.

Do you not see that? I am set at 1024 on a 19" screen - not sure if that makes a difference.

thanks
Mike

  djinn 12:54 06 Feb 06

I see it - not sure where the problem lies exactly but it could be the mix of percentages and fixed pixel dimensions.

I see you are using CSS - why not set a class for your tables in order to create the borders - this way you can get rid of unneccessary html markup.....

something like so....

CSS.....

.tableborder {
border: 1px solid #333333;
}

and apply to your tabes like so.....

<table width="800" border="0" cellpadding="0" cellspacing="0" class="tableborder">
<tr>
<td> </td>
</tr>
</table>

Make seperate classes as required - if ou need different coloured borders for instance

Something to remember is that those viewing at 800x600 will have hor scrollbars because of the chrome within the browser - perhaps a better width for your layout would be 760px.

HTH
Cheers

  effingpot 22:00 12 Feb 06

Thanks for the suggestion - I'm having a go at that. Can the same be done for a <td> entry to add a border?
ta
Mike

  djinn 21:33 13 Feb 06

Yes NP - Like so.....

<style type="text/css">
<!--
.tableborder {
border: 1px solid #333333;
}
.border1 {
background: #7D9BE3;
border: 1px solid #FF0033;
color: #FFFFFF;
}
-->
</style>

and in your html markup like so...

<table width="800" border="0" cellpadding="0" cellspacing="0" class="tableborder">
<tr align="center">
<td>regular cell</td>
<td class="border1">cell with border1 class applied</td>
<td>regular cell</td>
</tr>
<tr align="center">
<td>regular cell</td>
<td>regular cell</td>
<td>regular cell</td>
</tr>
<tr align="center">
<td class="border1">cell with border1 class applied</td>
<td>regular cell</td>
<td class="border1">cell with border1 class applied</td>
</tr>
</table>

  Kev.Ifty 02:15 14 Feb 06

Looks good to me..

When useing FireFox with the text size set to large. The link on the right 'Hurricane Relief' does not display correctly. In IE it is fine.

Kev.

  effingpot 08:53 14 Feb 06

Thanks djinn - I'll try that later. I'm rewriting the page from scratch I think.

This thread is now locked and can not be replied to.

What is ransomware and how do I protect my PC from WannaCry?

What I learned from my mentor, Oscar-winning VFX supervisor Phil Tippett

Siri vs Google Assistant