469,926 Members | 1,526 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,926 developers. It's quick & easy.

Footer css positioning problem

Hello

I am close to finishing my first properly css-friendly site (at least I hope
it is), and am looking for some general feedback, plus a specific question
answered, if possible.

http://www.ediecast.co.uk/ is the url.

The specific question is whether anyone can give me any help getting the
footer to actually go at the bottom of the page, rather than staying in the
wrong place, see
http://www.ediecast.co.uk/stocklist/...TyID=36&ScID=1

Any sort of comments are welcome. I have made the Cart pages as clear as
possible - to encourage people not to abandon the shopping process.

Thanks

Richard
Jul 20 '05 #1
2 1965
Els
Tim Charles wrote:
Hello

I am close to finishing my first properly css-friendly site
(at least I hope it is), and am looking for some general
feedback, plus a specific question answered, if possible.

http://www.ediecast.co.uk/ is the url.

The specific question is whether anyone can give me any
help getting the footer to actually go at the bottom of the
page, rather than staying in the wrong place, see
http://www.ediecast.co.uk/stocklist/...sp?ManID=30&Pr
TyID=36&ScID=1

Any sort of comments are welcome.


Try adding a doctype, and then validate the HTML.
http://validator.w3.org/

You've put a <link> element in the footer.
This should be in the head, where you already have it.

You used absolute positioning for the most important divs,
this will never get the footer to the bottom of the page.
Just to scare you a bit: look at your page in a Netscape,
Mozilla or Firefox browser, and press ctrl and '+' once or
twice. This is the direct result of the position:absolute
you're using.
It doesn't do this in IE only, because you used pixels for
font-size, which makes it impossible to scale the size. Very
bad for people with worse eyesight than very good.

Instead, work with floats, and put clear:both on the footer.
put font-size:100% in the body, and use only percentages of
that in other elements where appropriate.

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vo. O resto imperfeito.
- Renato Russo -
Jul 20 '05 #2
DU
Tim Charles wrote:
Hello

I am close to finishing my first properly css-friendly site (at least I hope
it is), and am looking for some general feedback, plus a specific question
answered, if possible.

http://www.ediecast.co.uk/ is the url.

The specific question is whether anyone can give me any help getting the
footer to actually go at the bottom of the page, rather than staying in the
wrong place, see
http://www.ediecast.co.uk/stocklist/...TyID=36&ScID=1

Any sort of comments are welcome. I have made the Cart pages as clear as
possible - to encourage people not to abandon the shopping process.

Thanks

Richard


You've got hundreds of markup and CSS errors in both files. First,
define a doctype declaration (I recommend you use strict HTML 4.01), put
all your <script>, <link> in the head part and very important, first
validate your document. Elements can not have the same id; id must be
unique for documents. You don't seem to know what improper nesting is:
so you have to start with understanding this very common situation.
You first need to tackle all of these issues. Then and only then,
positioning your footer will be very very easy to do.
I would avoid using absolute positioning, unless this is necessary and
unless of course you know well what abs. pos. means and implies. As far
as I can see, you don't need abs. pos. in your document.

http://validator.w3.org/check?verbos...diecast.co.uk/

http://validator.w3.org/check?verbos...D36%26ScID%3D1

http://jigsaw.w3.org/css-validator/v...diecast.co.uk/

http://jigsaw.w3.org/css-validator/v...D36%26ScID%3D1

Incorrect nesting of elements:
http://www.htmlhelp.com/tools/valida...s.html#nesting

List of valid doctype decl.:
http://www.w3.org/QA/2002/04/valid-dtd-list.html

W3C Quality assurance tips for webmasters:
http://www.w3.org/QA/Tips/

{
Good usage of CSS's font properties
Recommended Practices
(...)
* Do not specify the font-size in pt, or other absolute length
units. They render inconsistently across platforms and can't be resized
by the User Agent (e.g browser).
}
W3C Quality assurance tip for webmasters:
Care with font size
http://www.w3.org/QA/Tips/font-size#goodpractice

DU
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

reply views Thread by Roderik | last post: by
2 posts views Thread by Tristan Miller | last post: by
2 posts views Thread by Sailor Foley | last post: by
1 post views Thread by Will Buntin | last post: by
17 posts views Thread by Cerebral Believer | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.