5 replies [Last post]
steffen
Offline
newbie
Last seen: 15 years 50 weeks ago
Joined: 2006-02-11
Posts: 3
Points: 0

Hi, I am pretty new to css,but I really like what can be achieved through it so I am trying to learn it. But as I said, I'm new to it so I hope someone can help me out on a problem I'm facing.
(Trust me I have tried various ideas and google for two days now, and I'm just about to give up on css and go back to using tables. Asking for someone else to solve my problem is my last resort.)

The page can be found here
and the css here

The problem as you can see is that my footer does not sit nicely at the bottom of the page IF there's more content that what can fit in the viewport in the right collumn (note: in the css I use #hoyre which means #right - and venstre means left -- Just so you know)

I am pretty sure it is because the #hoyre div has a float:right; attribute, cause the footer follows the content if I remove that line, BUT then the layout looks like crap on a plate

I would be forever grateful if one of you css guru's could take a look and help me sort this problem out, or help me with another way of doing the layout in css (without float)

Jhorra
Offline
Enthusiast
Last seen: 14 years 7 weeks ago
Joined: 2004-06-04
Posts: 57
Points: 0

2-collumn Float+Footer problem

Try sticking a clear:both; in your footer tag.

steffen
Offline
newbie
Last seen: 15 years 50 weeks ago
Joined: 2006-02-11
Posts: 3
Points: 0

2-collumn Float+Footer problem

I don't mean to sound rude or anything, but if you had taken a look at the css you would see that I already have a clear:both; there Wink

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 46 weeks 6 days ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

2-collumn Float+Footer problem

Jhorra had the right idea, just the wrong solution for the case. The footer is position absolute, so the clear means nothing. You still need to enclose the float.

I think you could simply let the footer remain static position and the clear would work, or you can remove the clear rule as ineffective and make #container {overflow: hidden;}. Remove the height rules and the voice hack as unneeded. If you just must have some height rules, do {min-height: 100%; _height: 100%;}.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Jhorra
Offline
Enthusiast
Last seen: 14 years 7 weeks ago
Joined: 2004-06-04
Posts: 57
Points: 0

2-collumn Float+Footer problem

steffen wrote:
I don't mean to sound rude or anything, but if you had taken a look at the css you would see that I already have a clear:both; there Wink

Sorry, I didn't look at it. That's a common enough question that when you said you were knew I figured that was it. I did look at the page though.

steffen
Offline
newbie
Last seen: 15 years 50 weeks ago
Joined: 2006-02-11
Posts: 3
Points: 0

2-collumn Float+Footer problem

Hi again, thanks for the reply, I couldnt work it out, partly because my code was a little messy after all the desperate changes i had done to it - So I ended up re-doing from scratch. I also got a link from a similar site I spammed with my problem Wink that was really helpful; http://www.themaninblue.com/writing/perspective/2005/08/29/

Thanks again for the feedback! CSS can be a pain in the arse when it's not working, but its great when it does..