Wierd Footer thing

So I'm not exactly sure how I did this, and maybe it only looks like it to me, but when you look at this page (http://www.webpropertiesinc.com/broadmoor.htm) it seems as if the footer is pushed into the background or somehow beveled...but then again maybe it looks totally dumb and I need my eyes checked.

Lemme know what you think!

I put this thread in this forum because it has to do with the graphic effect of something, although it is not a graphic. Tell me if I should put stuff like this elsewhere.

-Ben

These all need to be lower case first, then see what it looks like.



/* Footer */
div.footer {
position: absolute;
bottom: 0px;
left: 0px;
Width: 90%;
BORDER-RIGHT: #dcdcdc 1px solid;
BORDER-TOP: #dcdcdc 1px solid;
BORDER-LEFT: #dcdcdc 1px solid;
BORDER-BOTTOM: #FFFFFF 1px solid;
PADDING: 2px 2px 2px 2px;
FONT-WEIGHT: normal;
FONT-SIZE: 10px;
FONT-FAMILY: verdana, Arial;
FONT-VARIANT: normal;
FONT-STYLE: normal;
TEXT-ALIGN: Center;
TEXT-TRANSFORM: none;
TEXT-DECORATION: none;
COLOR: #000000;
BACKGROUND-COLOR: #eee;
MARGIN: 10px 10px 10px 10px;
}

Ok, it didn't change anything. Any reason I'm supposed to have them all in lower case?

Originally posted by Ben@WEBProp
Ok, it didn't change anything. Any reason I'm supposed to have them all in lower case?

"Standards compliance" all attributes need to be lower case.

I'll look a little deeper.

Is this the only page it does it on?

MNS

I appreciate your helpful research, and I will make sure the rest of my css stays in lowercase. The effect on the footer happens on every page, and it is not so much a problem if it looks alright. It looks fine to me, but what do you think as far as:

1) How "ugly/cool" it is

2)How it occured

Thanks!

-Ben

Whoops, forgot something!

I am only having 2 problems with it thus far:

1) The thing wont become centered, but I am 75% sure that I can get this figured out by tomorow.

2) The stupid thing will SOMETIMES (but not always) overlap the bottom-most content of the page (usually the last line or two)

Any reasons why?

Thanks...again!

-Ben

This is why it looks like that:

BORDER-RIGHT: #dcdcdc 1px solid;
BORDER-TOP: #dcdcdc 1px solid;
BORDER-LEFT: #dcdcdc 1px solid;
BORDER-BOTTOM: #FFFFFF 1px solid;

If you do not want it to look like that remove the border or change it so it looks like you want it to.

I should have seen that one right off. D'oh!! :o

As far as it overlapping, I guess I need to see a page that it does that on to tell.

Center it the same way you centered your container div.

The attribute being upper case could cause a rendering problem in some browser I suppose. Not real sure on that one but if it were me I 'd change it all to lower case.


MNS

Oh, alright. I think I see t now, in that the borders are all slightly darker than the bg, and the bottom border is white. I dont remember doing that...but oh well!

Thanks! It always looked to me like a bevel effect rather than a white line on the bottom.

-Ben

You also should incase that address in the footer with an <address> element.
Semantic issues, you understand. ;)