Connecting Tech Pros Worldwide Help | Site Map

Help using CSS to position content to bottom of page

chris ciotti
Guest
 
Posts: n/a
#1: Jul 21 '05
Hello all -

I'm trying to position content at the bottom of a page (I'd like to anchor it
there). The majority of the code was generated using Photoshop CS and then
hand edited.

I'm having trouble because the top container does not extend the length of
the text block in hold (rubber space?) so when I position my bottom content,
it's in the middle of the page.

This is the page in question: (it validates)
http://www.stereo-link.com/Test/Static/1200Desc.html

The stylesheets(s): (they validate)
http://www.stereo-link.com/Test/CSS/...m-Left-Nav.css
http://www.stereo-link.com/Test/CSS/BodySetup.css
http://www.stereo-link.com/Test/CSS/site-main.css


Can anyone offer some guidance on how I might add content to the bottom of
the page? Thanks.

--chris

Lauri Raittila
Guest
 
Posts: n/a
#2: Jul 21 '05

re: Help using CSS to position content to bottom of page


in comp.infosystems.www.authoring.stylesheets, chris ciotti wrote:[color=blue]
> Hello all -
>
> I'm trying to position content at the bottom of a page (I'd like to anchor it
> there). The majority of the code was generated using Photoshop CS and then
> hand edited.[/color]

Aha. So that is the reason of text images for Arial.

Also notice that heading and top decoration take half page, that content
is only accessible with good luck (maybe 1/3 was clipped from right)

All those much more important things than what you are asking. Let me
guess, you didn't think at all that different people have differently
sized windows? And that my window is maximazed, and I still didn't see
much.
[color=blue]
> I'm having trouble because the top container does not extend the length of
> the text block in hold (rubber space?)[/color]

I don't understand your problem, big reason being fundamental problems in
site
[color=blue]
> so when I position my bottom content, it's in the middle of the page.[/color]
[color=blue]
> (it validates)[/color]

Which doesn't unfortunately mean anything special.
[color=blue]
> Can anyone offer some guidance on how I might add content to the bottom of
> the page? Thanks.[/color]

No, and makes no sence to think about it, as you need to redisign your
site. It has totally bad html (no logical markup), css (absolute
positioning with pixels and widths/heights never works) and javascript
(hover effect don't work, as it takes long time to download button
images). Too many images also, you could drop maybe half.

I could go on 3 pages on what exactly is wrong.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Utrecht, NL.
Gus Richter
Guest
 
Posts: n/a
#3: Jul 21 '05

re: Help using CSS to position content to bottom of page


chris ciotti wrote:[color=blue]
> Hello all -
>
> I'm trying to position content at the bottom of a page (I'd like to anchor it
> there). The majority of the code was generated using Photoshop CS and then
> hand edited.[/color]

Do you mean fixed by anchor?
[color=blue]
> I'm having trouble because the top container does not extend the length of
> the text block in hold (rubber space?) so when I position my bottom content,
> it's in the middle of the page.[/color]

Your right div is absolutely positioned. This means that it is not in
the flow and therefore does not contribute to the height - the height is
only as high as the left div in your case. Adding a bottom content
follows (flows) after the left div. Absolute positioning for the right
div is not apropos here.
[color=blue]
> This is the page in question: (it validates)
> http://www.stereo-link.com/Test/Static/1200Desc.html
>
> The stylesheets(s): (they validate)
> http://www.stereo-link.com/Test/CSS/...m-Left-Nav.css
> http://www.stereo-link.com/Test/CSS/BodySetup.css
> http://www.stereo-link.com/Test/CSS/site-main.css
>
>
> Can anyone offer some guidance on how I might add content to the bottom of
> the page? Thanks.
>[/color]

I'm not quite sure of exactly what you want. If you want to include a
section at the bottom of the document, then your (basically) two columns
represented by two divs should have the left div floated left allowing
the right div to flow to the right (prevent shrink-wrapping with a
left-margin value greater than the left div width). Then you add a third
div as your bottom content (footer) with a clear included.

If you wish to have a fixed bottom content, a la frames, then this third
div should include:
positioned:fixed; bottom:0;
which causes it to remain fixed at the bottom of your viewport when
scrolling.

--
Gus
chris.ciotti@gmail.com
Guest
 
Posts: n/a
#4: Jul 21 '05

re: Help using CSS to position content to bottom of page


Thanks Gus for your input. I don't do this sort of work, I'm trying to
help out a friend fix a broken site and your suggestion shed some
necessary light.

Regards,

chris

Closed Thread