New website issues (Firefox)

[tomssupra]

Hi,

 

Just wondering if anyone can point out the possible cause of an issue i'm having with Firefox - it seems to be reading my tables incorrectly compared to IE...

 

http://www.vanilla-brown.com/preview

 

You will see the gap beneath the header... is there a CSS fix for this at all?

 

Thanks for any pointers -

Tom

[Angarak]

Get the Firebug extension for Firefox, then right click the area with the gap and select "Inspect Element" - this will show the code in the region you clicked. As you mouse over the HTML elements they will be highlighted in the rendered website.

 

When I view the link in Firefox 3.5.6 I see a big gap between your image and the navigation links below....is this the problem you are referring to?

 

If so, using Firebug, it would appear the gap is caused by the

element in the following section of code:

 

							
header_3_top_side_left.pnghttp://www.tomshosting.co.uk/Vanilla%2DBrown/preview/header_3_top_9.jpgheader_3_top_side_right.png

 

There a couple of things to try, the first and probably most suprising is to remove any line breaks/spaces between the opening

and the following tag, and do the same for the closing

. This usually causes issues in IE from my experience.

 

If that doesnt fix it, try giving the

a custom class - for example:

 

// CSS
p.trim
{
margin: 0;
padding:0;
}

// XHTML

header_3_top_side_left.pnghttp://www.tomshosting.co.uk/Vanilla%2DBrown/preview/header_3_top_9.jpgheader_3_top_side_right.png

 

If that doesnt do the trick, try the same with the

that the section of code is contained within.

 

There is a padding/margin issue somewhere though in my opinion.

 

PS: In IE8, the image doesnt align up correctly horizontally, its out by about 2px, its noticeable on the "Vanilla Brown" sign to the right.

[tomssupra]

Simon, absolutely spot on, fixed in no time just by deleting

- thank you for your time.

[Angarak]

You're welcome mate, it would appear the IE8 alignment issue I mentioned was also related to the

issue - it aligns fine now.

 

I can't tell you how valuable the Firebug extension has been to me when debugging some of my own stuff