I have jut begun to build a new sit e using CSS this is the first time doing so for me. Previously I did everything in tables and I have to say this is a bugger to figure out for the first time. So I have a external style sheet and my main page (right now index2.html)
firstly it is a 3 column layout. Dreaweaver is butchering the layout any time I put any content inside the main sections and if I put anything in the "menu div" text appears OUTSIDE of the conatiner its in when the page is rendered. I dont know how that even works. So the layout is as follows:
A main container "wrapper". This is used to center everything in the page. Inside wrapper is "pghead" (this contains a header image) then below is "nav" which will hold page specific navigation. Then below those are the 3 columns for the layout. First "menu" which will hold global navigation for the site. then "content" which will hold the main content and finally "rtbox" which will hold random news etc.
then a copyright notice "copynote" and a footer "footer" all at the bottom. So the first issue is that the page looks nothing like the rendered page in dream weaver, I can live with that but its making it damn hard to lay this thing out as it keeps moving and never looks the same when rendered.
Next is cross browser compatibiltiy I've got it just about looking right WITHOUT any content inside on explorer 6 but when I render it in Firefox its all off plus one of the photos doesnt load
You can see the page here
the css is available as a text file here
(the real file has the appropriate .css extension)
To answer this question:
1. I validated the css and the html, but stuff is still wrong, so tell me If I missed something
2. A short discussion on positioning behavior of Divs in Dreamweaver, any way to approach my layout differently but get the same result?(see the css)
3. Firefox issue whats causing it what do I do to fix it? or is it explorer?
Any other information would be appreciated.