Css – min-height Not Working in Google Chrome


Hello i seem to have a problem with what could be technically called 'a huge gap down the bottom of my website on Google Chrome'. I think it is to do with this code-

#container {
    width: 968px;
    min-height: 2100px;

I have changed the min height down to 600px and things seem to be ok on Firefox and IE9. On Chrome though there is a massive gap. You can view my site here-

It's depressing as i use Chrome for the admin side of things on my site and i have to look at all day every day and it's starting to get me a little down. I have asked about the internet but have had no response even from the place where i bought the theme (they seem to have the same problem on their demo site)

Id there anyway to fox this?



Best Solution

Without looking at the actual problem...

You're using an HTML 4 Transitional doctype with namespaces in your <html>. Funny and faulty.

-- edit 1

The problem is the weird located footer img. Make that a block with CSS and you're golden: display: block;

-- edit 2

The min-height has nothing to do with it. Why do you even have a min-height??