Bloody Internet Explorer!

Hello,

I am managing a site and am having some trouble with the table sizes.

I know I should be using CSS instead of tables to arrange and centre the pages! But I am not quite confident enough in CSS yet.

The 'about us' and 'contact' pages are fine but all the others are stretching.
This is most emphasized in IE. Esp the 'retreats' & 'resources' pages.

Any help much appreciated!!

Thanks.

http://www.noddfa.org.uk/about.htm (THE SITE)
My styles css.-

a:link {
color: #808080;
}
a:visited {
color: #808080;
}
a:hover {
color: #565656;
}
a:active {
color: #565656;
}
.nod {
font-size: 7em;
font-family: Garamond, "Times New Roman", Georgia, Arial;
color: #808080;
}
.mainTable {
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-color: #C4CE93;
border-right-color: #C4CE93;
border-bottom-color: #C4CE93;
border-left-color: #C4CE93;
width: 800px;
}
.cop {
font-size: .75em;
}
.text {
font-size: 1em;
color: #000;
font-family: Georgia, "Times New Roman", Times, serif;
text-align: center;
}
.blackText {
font-family: Arial, Helvetica, sans-serif;
color: #000;
font-size: 1em;
padding-right: 30px;
padding-left: 40px;
text-align: left;
}
.links {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
color: #808080;
}
.contactImage {
padding-right: 30px;
margin-right: 20px;
}



h1 {
font-weight: bold;
color: #808080;
font-family: Arial, Helvetica, sans-serif;
padding-left: 30px;
}
h2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 1.8em;
color: #808000;
padding-left: 276px;
font-weight: normal;
}
h3 {
font-family: Arial, Helvetica, sans-serif;
color: #808000;
padding-left: 276px;
font-weight: normal;
font-size: 1.5em;
}



.image {
padding-bottom: 30px;
margin-right: 15px;
}
.cap {
font-family: Arial, Helvetica, sans-serif;
font-size: 0.6em;
font-style: italic;
color: #5B5B00;
}
.alignBlack {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
color: #000;
padding-left: 276px;
padding-right: 10px;
}
.textleft {
font-size: 1em;
color: #808000;
font-family: Arial, Helvetica, sans-serif;
padding-left: 30px;
padding-right: 40px;
}
.textGreenCent {
font-size: 1.5em;
color: #808000;
font-family: Georgia, "Times New Roman", Times, serif;
text-align: center;
font-weight: bold;
}

can't see a problem?

can't see a problem?

With IE or the code?

Hello beautyfiend,
You should be more specific. FF and IE8 both display it the same. IE7 and lower seems to show the widening problem you describe.

I can't say why it's doing it though, I don't know enough about tables ...
Have you checked the validator? Look at the links about validation in my sig below.
It looks like you might have some messed up </td> tags? http://validator.w3.org/check?verbose=1&uri=http%3a%2f%2fwww.noddfa.org.uk%2fresources.htm

The link you provide to your site is messed up.
Should be more like this: http://www.noddfa.org.uk/about.htm

Hi,

I have sorted out my code and I worked out the problem was with the padding left.
.alignBlack {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
color: #000;
padding-left: 276px;
padding-right: 10px;

thanks:rolleyes: