My Footer is at the top!

derivadow · Member · Sep 16, 2007 at 7:33 pm
Copy link

Add topic to favorites
I’ve monkeyed around a bit with the ‘unsleepable’ theme (http://derivadow.com) and although I’m more or less happy I’ve a couple of bugs I can’t resolve – any pointers gratefully received :)

So I’ve two bugs:

1. The footer when viewing a post or a page (e.g. http://derivadow.com/2007/09/11/wabi-sabi-design-to-age/) moves to the top of the page – originally it obscured the nav bar but I set the overflow so that at least the site works even if the footer is in the wrong place and its a bit ugly.

2. I’ve also set a background image on the read more link (should be a little arrow to the left of the text) – this use to work but now it doesn’t and I now can’t get it back… tried adjusting padding etc. but no joy :(

Thanks
Tom
steve2400 · Member · Sep 16, 2007 at 8:12 pm
Copy link
Did you set the “clear:both” in the css for your footer? Using overflow is unnecessary in any situation from what I hear. Also use a clearing div (which is blank) and use the same CSS attribute, that should work.
derivadow · Member · Sep 16, 2007 at 9:31 pm
Copy link
Thanks Steve – the clear:both doesn’t appear to work (I’ve tried setting it on both the header and the footer). I might not be using the clearing div properly – but that doesn’t seen to work either :(

The overflow is really just a work around – the footer is floating top right which is ugly but at least the page is visible without it the footer can cover the entire page (depending on the window width)!
mymyspacelayouts · Member · Sep 17, 2007 at 1:45 am
Copy link
From what I’m seeing, your page looks the way it should.
raincoaster · Member · Sep 17, 2007 at 2:10 am
Copy link
I agree: either you fixed it or the error doesn’t show up on my Firefox. Nice-looking blog, very clean!
derivadow · Member · Sep 17, 2007 at 9:27 am
Copy link
May be its just a problem with Mac + Firefox… but its still a bug! Have a look at http://derivadow.com/2007/09/11/wabi-sabi-design-to-age/ and scroll to the right… the footer is top right.
niyse · Member · Sep 17, 2007 at 10:29 am
Copy link
True. I viewed it with Firefox ver 2.0.0.6 (on a PC) and I see your error with the footer.

I have no idea what to do about it, though, just wanted to let you know that you’re not the only one seeing the error.

– Biyang Hansen
chrislevinsonphotography · Member · Sep 17, 2007 at 10:37 am
Copy link
I see it in Firefox and IE. It’s fine on the front page, but click on an individual post (or page) and the footer goes to the top.

In your #page css, you’ve got float: left. Change it to float: center. I think that should put the footer back at the bottom.

I’m not sure about the read more link… I’ll have to have a closer look, unless someone beats me to it. :)
chrislevinsonphotography · Member · Sep 17, 2007 at 11:57 am
Copy link
Okay, I think I’ve found the read more link problem. It’s the #more-link css. You need to remove the hyphen between the words. It should be morelink. That should bring the arrow back.
derivadow · Member · Sep 17, 2007 at 12:08 pm
Copy link
cjwriter – float:center worked, many thanks :)
derivadow · Member · Sep 17, 2007 at 12:23 pm
Copy link
cjwriter – again many thanks for your time and help. The more-link / morelink was the problem… all working as it should :) Thank you.
chrislevinsonphotography · Member · Sep 17, 2007 at 12:29 pm
Copy link
No worries; I’m still learning with css as well, so it’s trial and error. Happy blogging. :)
derivadow · Member · Sep 17, 2007 at 12:31 pm
Copy link
Ah just realized – changing the float to center, centers the page(!) Is there are way to have the page left aligned without mucking up the footer?
chrislevinsonphotography · Member · Sep 17, 2007 at 1:35 pm
Copy link
I think it’s possible, but unfortunately it’s outside of my skills, or I can’t get it to work with Unsleepable anyway. Devblog or atthe404 might be able to help you when they see it.
derivadow · Member · Sep 17, 2007 at 1:52 pm
Copy link
OK, and thanks for looking into it for me (and at least it makes me feel less stupid that I couldn’t debug it myself).
devblog · Member · Sep 17, 2007 at 4:49 pm
Copy link
Guys, there’s no “center” value for the “float” property. Though it works, its use is incorrect. The values for the float property are: left, right, none and inherit

derivadow,

What changes did you make to the CSS? Don’t post the whole CSS code here. Just list the selectors you changed just for reference.

What is it that you are trying to accomplish? I mean, was the page originally aligned to the left or you want it to look like that?
derivadow · Member · Sep 17, 2007 at 5:09 pm
Copy link
devblog, here’s the relevant snip of css:
```
#page {
background:#fff;
background-position:right !important;
text-align:left;
position:relative;
width:775px;
float:center;
border-left:20px solid white;
margin:0 auto;
padding:0;
}
```
I changed it to float:left – but this caused the problems with the footer… I’ve changed it back to float:center and the footer is at the bottom of the page where it should be.

But I don’t really what the page centered. I would like to have it aligned to the left with a white 20px left margin.

Thank you for your time :)
atthe404 · Member · Sep 17, 2007 at 5:58 pm
Copy link
The #page need not be floated at all.
To set it as described would require:
margin: 0px auto; to be deleted
derivadow · Member · Sep 17, 2007 at 7:46 pm
Copy link
atthe404 – brilliant! Thank you.

And thanks to all.

Tom
atthe404 · Member · Sep 17, 2007 at 9:41 pm
Copy link
brilliant? I like that. Thanks :)

No items found.