Header and footer div's move when window is minimized

[Biggaz1979]

Hey guys,
I am quite new to web development and am self taught, I have an issue with a website I am developing for my college. The header and footer wrap tags I have created seem to move to the left when the window is minimized, I'm guessing this is something to do with the main div's in the center not moving to allow for the minimization? Does anyone have a solution? The site is in my test directory on my server here

I would appreciate any help please :)

[drhowarddrfine]

I don't see it. I see the whole thing moving to the left, which it should cause it's actually centering itself. Which browser?

[Biggaz1979]

@drhowarddrfine
Sorry yeah that's what I mean, the header and footer move to the left and leaves a gap at the right side when minimized in all browsers.

[drhowarddrfine]

Don't see the problem.

[Biggaz1979]

If you minimize the window, then scroll either to the top or the bottom, then to the right, you can see the header and footer tags wrap end about 300px from the right side of the header tag.

[drhowarddrfine]

Cause there's no room for them. Sorry, but leaving for Chicago right now. Won't be back till Sunday night.

[Biggaz1979]

I think I have solved this now, but for some reason the site seems to be different in different browsers, it only displays correctly in Chrome and Safari for some reason, anyone have any ideas? Or shall I open a new thread for this?

[drhowarddrfine]

I had forgotten about this. Not that I'm any more free but please post your solution that it might help others.

Yes, start another thread.

[Biggaz1979]

Okay, My solution was quite simple really, I just removed the background images from my header and footer container tags, then created a background image with gradient and set it to the page height but have it set to repeat-y for wider browsers, now all I need to do is increase the height if my pages gets taller with time, unless I find a way for it to move with the flow of the page. I am still learning so I may have done this wrong, but it will work for now.

[drhowarddrfine]

Validate your html for that list of errors.

[Biggaz1979]

The only errors I have are from my flash files, the last time I checked anyway lol, I will be correcting the embed issues before the site goes live properly.

[Bharat383]

if you are floating one or more <div> than after completing floating use <div style="clear:both"></div>

like this :::

<div class="header">
 
</div>
<div style="clear:both"></div>
<div class="content">
 
</div>
<div style="clear:both"></div>
<div class="footer">
 
</div>