Stylesheets - footer & 3 col absolute layout

Author

footer & 3 col absolute layout

sonya11@excite.it

2005-11-29, 6:50 pm

hi all,

sorry I realize the topic is well known, anyway is there a way without
using javascript to have a footer always under a 3 column layout with
Absolute Positioning ?

I don' t want to use float 'cause I want to organize content in a
better order for accessibility
and search engine optimization ( content first ) and I cannot know in
advance the height of the central column 'cause the content is taken
from a database and so the central column could be shorter than the two
absolute-positioned on the side.

All tutorials I found say there is no way without using a bit of
javascript but this could be blocked by users, so any solution ?

TIA

sonya :)

Spartanicus

2005-11-29, 6:50 pm

sonya11@excite.it wrote:

>sorry I realize the topic is well known, anyway is there a way without
>using javascript to have a footer always under a 3 column layout with
>Absolute Positioning ?
>
>I don' t want to use float 'cause I want to organize content in a
>better order for accessibility
>and search engine optimization ( content first ) and I cannot know in
>advance the height of the central column 'cause the content is taken
>from a database and so the central column could be shorter than the two
>absolute-positioned on the side.

Only at the bottom of the viewport and with a footer with a specified
height. If there isn't enough main content to reach the footer you will
have a gap.

IE CSS support may also be a problem.

--
Spartanicus

2005-11-29, 6:50 pm

sonya11@excite.it wrote:
> hi all,
>
> sorry I realize the topic is well known, anyway is there a way without
> using javascript to have a footer always under a 3 column layout with
> Absolute Positioning ?
>
> I don' t want to use float 'cause I want to organize content in a
> better order for accessibility
> and search engine optimization ( content first ) and I cannot know in
> advance the height of the central column 'cause the content is taken
> from a database and so the central column could be shorter than the two
> absolute-positioned on the side.
>
> All tutorials I found say there is no way without using a bit of
> javascript but this could be blocked by users, so any solution ?
>
> TIA
>
> sonya :)
>
Is this (work in progress) page similar to what you are looking for?
http://speakenglish.noswad.me.uk

It has a hidden div in the center content, which is the length of the
side content (got the idea after seeing a message from Spartanicus
regarding 3 equally spaced images)

AD

Pawel Knapik

2005-11-29, 6:52 pm

sonya11@excite.it napisał(a):
> hi all,
>
> sorry I realize the topic is well known, anyway is there a way without
> using javascript to have a footer always under a 3 column layout with
> Absolute Positioning ?
>
> I don' t want to use float 'cause I want to organize content in a
> better order for accessibility
> and search engine optimization ( content first )

I know it isn't the answer for your question, but it may be
a solution for your problem. If one additional <div> won't
make you feel bad you can create layout with content first
using floats:

<body>
<div id="wrapper">
<div id="content">
content here.
</div>

<div id="sidebarOne">
sidebar one.
</div>
</div>

<div id="sidebarTwo">
sidebar 2
</div>
<div id="footer"> footer </div>
</body>

CSS for sidebar1 | content | sidebar2:
#content { float:right; width: 66%; }
#sidebarOne { float:left; width: 33%; }
#sidebarTwo { float: right; width:33%; }
#wrapper { float:left; width:66%; }
#footer { clear:both; }

CSS for sidebar2 | content | sidebar1:
#content { float:left; width: 66%; }
#sidebarOne { float:right; width: 33%; }
#sidebarTwo { float: left; width:33%; }
#wrapper { float:right; width:66%; }
#footer { clear:both; }

You can make easily:
sb2 | sb1 | content
and
content | sb1 | sb2

You'd need reorder the code (or use absolute values) to
create sb1 | sb2 | content or content | sb2 | sb1.

Robert Frost-Bridges

2005-11-29, 6:52 pm

sonya11@excite.it wrote:

>
> hi all,
>
> sorry I realize the topic is well known, anyway is there a way without
> using javascript to have a footer always under a 3 column layout with
> Absolute Positioning ?
>
> I don' t want to use float 'cause I want to organize content in a
> better order for accessibility
> and search engine optimization ( content first ) and I cannot know in
> advance the height of the central column 'cause the content is taken
> from a database and so the central column could be shorter than the two
> absolute-positioned on the side.
>
> All tutorials I found say there is no way without using a bit of
> javascript but this could be blocked by users, so any solution ?

There is this: http://positioniseverything.net/articles/onetruelayout/

which includes any order/full height columns using CSS although I'm not sure
how robust it is.

--
Robert
http://brightonfixedodds.net