/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Footer Problems in Div Layout

Copy linkTweet thisAlerts:
Feb 10.2010

Some of you may have helped me before with the website i’m working on. I got the layout nicely done, with a 190px header with the title and logo in, and a 30px footer at the bottom. I have a container div, position:relative, and then divs inside that. The footer has position absolute and sits at the bottom.

[url]http://www.remarkable-one.com/new/services.php[/url]

That is the page, and as you can see the footer just positions itself on top of the content if the content extends beyond the height of the page. I would put overflow: auto on it but i want overflow-y:auto and that is only supported by css3, otherwise, it just thinks my content is too wide and adds a scrollbar.

My code is valid. What can i do? (on my css file, the actual page coding is at the bottom).

Thanks!

to post a comment
CSS

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@CFHuttonFeb 10.2010 — I've used this technique recently: sticky footer alt

If I remember correctly, the idea is to pull the footer out of the wrapper. Setup your content div to have a bottom padding sufficient for the footer to overlap the bottom of the content div entirely without ever running over any actual content, and use negative margin on the footer. Just follow the instructions at that site.

The only thing is I never tested it in ie8. I did test it in ie6, ie7, ff3.5, chrome4, safari4, and even nn9(just for giggles).
Copy linkTweet thisAlerts:
@flashcusauthorFeb 11.2010 — Worked a treat, thanks ?
×

Success!

Help @flashcus spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.6,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...