If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Hybrid View

Header, Footer, Content problems?

Hi, I'm new to having a footer on my page. I've always just used a Header. But using a Footer is confusing me a lot.
I've managed to find a great template which I'm using but I'm still having some problems.

There is an annoying space between my header and the start of my content which I don't think should be there.

The main problem though is that the content and footer parts are overlapping each other.

Addin a footer to your page is not the problem. The problem is that you have 5 <head></head> tags, 5 <bod></body> tags and 4 <html></html> tags. This basically means that you are creating 4 / 5 HTML pages within one page. I don't even know where to start to help you until you sort all your basic coding out.

All I can suggest is that you strip everything out of your code and start a new page with one set of <html>,<head> and <body> tags then copy and paste your required content into the <body> section as an html page should be formatted. Once you have this working you can take out the sections from the page and save them into your header and footer ect files and include the once again.

I've used a different tutorial online and even though I think the coding is better, it still doesn't work properly in that the header, content and footer still overlap. This time I've not used a style CSS as it wasn't part of the tutorial.

Firstly, even if the tutorial has inline CSS, move it out to a separate stylesheet and give each div a name. Secondly remove the positioning from the styles (there seems to be a trend for using position: absolute it all styles at the moment and I don't know why as not required that much and causes problem). Use floating and margins instead.

I was going to sort it into a working example for you but there is another fatal flaw in your code and that is that your div styles have one width but the images you are using inside these divs have larger widths so won't fit so I am stuck as to how to do this for you with the information provided (for example in your footer, the div is set to a width of 349px but the footer.png image is 976px wide).