Body Border Problem

[anthonykrese]

Just started as a content manager (pr person) for a website. I upgraded WordPress and now the body border-bottom of 5px appears more than halfway up the page. I’ve set the border to 0px so it doesn’t show up (as it’s a live commercial site). I’ve checked my local install and everything seems to match up, except my page bottom-border is fine!

If you go to http://www.ailnz.co.nz, open up firebug to css mode and set the body border-bottom to 5px, you’ll see the border doesn’t sit at the bottom. I’m working hard to learn CSS myself, but I want to fix this asap. Could anyone give me a lead?

As I’m still green, the post regarding w3 validation was welcome, except my site got an error. sigh. A warm welcome to the web for me. haha…off hunting for the answer to that one. Any advice would be much appreciated.

[TheDoc]

Well would you look at that, what an interesting problem. Normally I would say something about clearing your floats, but I’m not sure that applies in the case of styles applied to the body.

I’ll have to ponder this one for a sec.

[dvdgoss]

The height of the body seems to be defaulting to 100% (you’ll notice if you add the border thickness in that it will always appear just below the visible area of the window it loads in). The only thing I can think of is to take the properties off the body tag and instead apply them to a big all-encompassing container div and give it a min-height of 100%. Might work.

[TheDoc]

"dvdgoss" wrote:

The height of the body seems to be defaulting to 100% (you’ll notice if you add the border thickness in that it will always appear just below the visible area of the window it loads in). The only thing I can think of is to take the properties off the body tag and instead apply them to a big all-encompassing container div and give it a min-height of 100%. Might work.

Nice find!

Simply removing this style:

Code:

html, body {
height: 100%;
}

Seemed to do the trick for me, give that one a go.

[Author]

Posts