toad78 — 2012-02-21T04:02:20-05:00 — #1
I'm having trouble getting content on the bottom of this page to be placed closer to the top of the black background. The red thin line should be running just above the 'Copyright', but I'm having trouble figuring out what is causing the gap.
I'd like to know what's causing the excessive spacing and how I should fix it.
ralphm — 2012-02-21T04:15:24-05:00 — #2
When you give an element position: relative and then move it (say with a negative top setting) the space that the element would naturally have occupied is preserved. So that excessive black area is where things like #contmo are supposed to be.
So it would be better to use a different method to create the look you want. Perhaps provide a screen shot of what you actually are aiming for.
toad78 — 2012-02-21T11:03:43-05:00 — #3
Thank you for catching that and good point. As for the way it should look, everything above the bottom is the way it needs to look; but the bottom should look like the attached with the white background flowing to the grey gradient.
Plus, I need the red bar across the top below the sunburst to appear:
I know that I can make '#contmo' position: absolute to the top:0 and then make another container with the width of 950px and add the padding to show the background shadow, but then I lose my 'topl' and 'bottoml' backgrounds.
toad78 — 2012-02-21T23:47:51-05:00 — #4
Looks like I was able to fix the problem by modifying the background image slices and remove the negative, relative positioning.
Looks great now!
ralphm — 2012-02-22T01:06:47-05:00 — #5
Cool, glad you sorted it. It's always more satisfying that way.