/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Footer issues – please HELP!

I can’t seem to get my footer to always be positioned after the longest of three columns. It seems to want to go right below the middle column even when the third column is the longest. For an example, see the differences between [URL=”http://www2.ccboe.com/smallwood/”]http://www2.ccboe.com/smallwood/[/URL], [URL=”http://www2.ccboe.com/smallwood/aboutus/”]http://www2.ccboe.com/smallwood/aboutus/[/URL], and [URL=”http://www2.ccboe.com/smallwood/news/”]http://www2.ccboe.com/smallwood/news/[/URL].

Any help would be much appreciated! My code is as follows:

body {
background: url(/images/smallwood/smallwood_pagebg.png) no-repeat top center #000D4F;
margin: 0;
padding: 0;
text-align: center;
color: #000D4F;
font-size:16px;
}
.thrColAbsHdr #container {
position: relative;
width: 780px;
margin: 0 auto;
text-align: left;
}

.thrColAbsHdr #header {
height: 140px;
padding: 0 10px 0 0px;
background:url(/images/smallwood/smallwood_header.gif) no-repeat left top;
}
.thrColAbsHdr #header p {
margin: 0;
padding: 3px 0;
text-align:right;
color:#FFFFFF;
}
.thrColAbsHdr #header a {
color:#FFFFFF;
}
.thrColAbsHdr #sidebar1 {
position: absolute;
top: 115px;
left: 0;
width: 140px;
padding: 15px 10px 15px 20px;

.thrColAbsHdr #sidebar1 img.first {
position: relative;
}

.thrColAbsHdr #sidebar2 {
position: absolute;
top: 105px;
right: 0;
width: 150px;
background: #ffc619;
padding: 15px 10px 15px 10px;
border: solid 1px #ffdf80;
}

.thrColAbsHdr #sidebar2 img.first {
position: absolute;
top: -75px;
margin-left: 10px;
}
.thrColAbsHdr #mainContent {
margin: -35px 180px 5px 175px;
padding: 0 10px;
background: #ffdf80;
border: solid 1px #ffc619;
height: auto;
}

.thrColAbsHdr #footer {
height:78px;
padding: 0 10px 0 20px;
background: url(/images/smallwood/smallwood_footer.png) no-repeat bottom left #ffc619;
border: solid 1px #ffdf80;
margin-top:10%;

}
.thrColAbsHdr #footer p {
margin: 0;
padding: 10px 0;
}

to post a comment
CSS

2 Comments(s)

Copy linkTweet thisAlerts:
@ray326Aug 08.2008 — I'd start with a div wrapping the sidebars and maincontent and the footer outside of that.

http://alistapart.com/articles/holygrail
Copy linkTweet thisAlerts:
@ssprouseauthorAug 11.2008 — Thank you, thank you, thank you! Aside from one annoying issue this is working perfectly!
×

Success!

Help @ssprouse 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.18,
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,
)...