CSS align problems...always IE

[Sdashiki]

I cant seem to figure this one out.

I have a footer at the bottom of my page. Its fine as it is.

I have 2 columns, left for navi, right for main text.

I want the main text column to have a background img at the bottom of it. Currently, I have the image within the column and a class applied to it:

{
height:400px;
position:absolute;
bottom:0px;}

Ive gotten this to show up fine in Firefox, but when I goto IE it drops the the very bottom the the page and not the div it is within.

this pic may illustrate the problem a bit better.



Why is IE, the top pic, dropping the img to the bottom of the page and not to the div?

 

[dejo]

Why is IE, the top pic, dropping the img to the bottom of the page and not to the div?

I can't say for sure without looking at all the HTML and CSS but it's probably because you have position:absolute on that DIV, and no position:relative on its parent element. Therefore the browser is rendering that DIV positioned absolutely 0px from the bottom of the entire page.

 

[Makosuke]

Just out of curiosity, is there any reason you're not just putting the image in the background of the relevant DIV?

That is, something along these lines:

{
background: white url(backgroundimage.jpg);
background-repeat: no-repeat;
background-position: bottom left;
}

That's what I usually do when I want an image at the bottom of something, unless I specifically need the image to be clickable. I don't believe IE has any trouble with this. (And if you don't want text overlapping it, just put an appropriately fat bottom padding on that DIV.)

 

[johnmartin78]

IE7 gave me so many problems I've abandoned it.They changed the way it generates code,making it even more of a pain in the rear than ever.

 

[Sdashiki]

I did finally just apply it to the background of the div it was within.

dont know why it wasnt working before. as i did have the parent "wrapper" set to relative.

i needed this to be a div so that it was only on the main page, all other pages, which share the same CSS, would not have this background image, or any image at all.

my work around was to create 2 div IDs, and assign a background to the one for this main page.

still, IE, sucks.