I'm really new at this and I'm looking for some friendly advice . I'm doing a project for college where I have to put together a website I want to use CSS but I'm finding it hard to get to grips with... Anyway I designed a website that displays perfectly within Internet Explorer but when viewed within Firefox the formatting goes off. The main problem is the spacing as seen below.



We are working from a template hence some of the coding issues like myself putting a background in HTML rather than CSS, I've since worked out how to do that but I just can't get this spacing thing sorted out! Any help is really appreciated.

CSS Sheet:

http://www3.webng.com/Boudreaux/style.css

Basic view of the website without images/flash + typos

http://www3.webng.com/Boudreaux/my%20web.html

All the images are missing on http://www3.webng.com/Boudreaux/my%20web.html . Makes it a little hard to see what spaces are the annoying ones. You also have JavaScript errors.

Generally it's better to code for FF and other standard compatible browsers and hack for IE bugs later. Otherwise you may end up implementing fixes that aren't needed. It's harder work to do it that way anyway.

Get the images up and we'll have a look again.

Thats great really appreciate the reply. I've re-uploaded some of the images and the main part of the site can be seen here I do have some other formatting issues but the main one seems to be between "Parent Information" and "School Performance" if someone could help close that gap I would be most grateful

OK. It's related to the errors the validator finds with your table code.
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes

Here.


You close a table row and then go on with a new cell without starting a new TR. That's the error the validator sees.

What causes the display problem is that the other items aren't in their own rows or cells. The <div id="themes"> shouldn't be there either, I think. You can't use an id twice. Just don't close the previous DIV with the same id (one of the two closing tags for DIV in the beginning of the snippet above). Also, the other items are (partly) enclosed in a P. P has default margins so that may affect the look too.



I think this will fix your problem. Note, I'm not saying this is a god way to do it. It isn't. You shouldn't use spacers and P to create margins, you should use CSS 'margin'.

At least you should correct the errors the validator reports (fewer once you've gotten rid if the funky table code). Did a WYSIWYG editor create this BTW?

Fantastic Really that is a great help. It does solve an immediate problem but I really need to read up on this and correct the errors you mentioned. I found a great link to a beginners guide of CSS on this site which I need to read and try soak up. Hopefully I aim to redo this correctly in CSS and correct some of the errors. I think the lecturer created the base template/foundation within Dreamweaver although I'm not 100%. I like the error code checking website really useful Sorry to harp on but again thanks it’s refreshing to get a nice response

Your teach, eh? Then maybe HE should learn HTML.

If you want to learn CSS, you should really start with learning HTML. I mean what the "tags" are for, not the visual effect they happen to create. Tagsoup + CSS = bigger tagsoup. It may seem boring, but you'll benefit in the long run, trust me.

My regards to your teacher (not!).