footer & 3 col absolute layout

#1

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

#2

sonya11 (AT) excite (DOT) it wrote:

Quote:

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

#3

sonya11 (AT) excite (DOT) it wrote:

Quote:

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

#4

sonya11 (AT) excite (DOT) it napisał(a):

Quote:

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.

#5

sonya11 (AT) excite (DOT) it wrote:

Quote:

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

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

footer & 3 col absolute layout

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)

footer & 3 col absolute layout - 11-29-2005 , 07:12 AM

Re: footer & 3 col absolute layout - 11-29-2005 , 07:42 AM

Re: footer & 3 col absolute layout - 11-29-2005 , 11:06 AM

Re: footer & 3 col absolute layout - 11-29-2005 , 02:13 PM

Re: footer & 3 col absolute layout - 11-29-2005 , 03:40 PM