[SOLVED] Footer background image issue
I have finally gotten my footer image to repeat, but some how a background color is being added. The image http://takerootmontgomery.org/wp-con.../footer-bg.png is a .png and has a transparent background. I don't know where the #FFFFFF background is coming from.
I have looked thru all the ATO settings and have looked at the code via source view and firebug. I can't seem to find where the background color is being added. If someone could take a look at my code, I would appreciate it. I feel like its right in front of me, but because I've been looking at it so intensely that i'm just missing it. FOOTER HTML HTML Code:
</td></tr></table></div></div> HTML Code:
div#divfooter { |
Have you looked at it with firebug to see where it may be inherited from?
|
I've looked everywhere. I have gone over it with a fine-toothed comb. I have narrowed it down to it having to be in this bit
HTML Code:
</td></tr></table></div></div> |
well without access I can't do much...
|
|
Actually there is nothing wrong, it's just not what you want
You have added a new area to the page which extends the BODY but not the WRAPPER - it is at the same level as the WRAPPER, just wider. Now the coltwo has the background image and it is repeated to the botom of the WRAPPER and ends, then the new area DIVFOOTER starts up You are going to have to try adding a 'position' and top or bottom to try and move it up so it overlaps the WRAPPER |
That doesn't make any sense because if I leave the CSS and HTML the way they are but delete the background image, I am left with a white strip as the footer and it isn't the image I'm using for coltwo.
|
I know it is a hard thing to wrap our head around but the white space that remaind is just the area of the window that is taller than the content height.
to show this, do this. Add the following to the CSS Inserts HTML Code:
body {border: solid 1px red; } now remove your new footer code and refresh the page and you will see teh bottom border of the body and wrapper are the same, but there is white space behind it - that is the area of the window that is taller than the body. Resize the window so you get a scrool bar and then scrool down. It will stop when the bottom of the body shows. now you could see if the 'Sticky footer on short pages?' option would help... |
Wow using the borders really helped me see what you were talking about. Thank you so much!
So now, using "top" I have gotten the footer to come up above the wrapper, but now i'm left with a large white strip underneath the footer due to it's having moved. Ideally, I would like to get rid of it, but I could live with it being the same green as the image. Any idea how I might achieve this? |
why not put your code in the footer and give the div a width of 100% - you may need to use a negative margin to move it down.
|
To which code are you referring? This?
HTML Code:
div#divfooter { |
no, you closed off the actual footer, get rid of that so what you have in the footer is this
HTML Code:
<div id="divfooter"> HTML Code:
div#divfooter { |
Here's what I ended up with.
HTML Code:
<div id="divfooter"> HTML Code:
div#divfooter { |
All times are GMT -6. The time now is 06:38 PM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.