Re: [WSG] Fixed Height: Headers and Footers
Thanks for your pointers, unfortunately it's for a client intranet site and they exclusively use I.E. 6 (more's the pitty) . I modified your suggestion to used position: absolute and have a fixed height (which i can just about work with), which although means i don't get the same scroll bar behaviour does seem to work fine.Am I right in thinking i would use the "MIME Map" section of the "Http Headers" tab in the IIS properties for a particular site to change how the pages are served?Christian Montoya [EMAIL PROTECTED] wrote: On 12/16/05, CHRISTOPHER MEEK <[EMAIL PROTECTED]>wrote: I'm attempting to move a site away from using 10's of nested tables towards using just CSS I have a layout with 3 vertical elements, a header a footer and the
content The header, obviously sits quietly at the top of the screen but will chane size depending on content The content comes next with overflow: auto so that it scrolls as needed The footer needs to sit permanently at the bottom of the screen.What you really want is a fixed header and footer. I'm not sure howdesirable this is since this consumes a lot of screen space, but formost browsers it's as simple as applying position:fixed to both divs.So you would have:#header { position:fixed; top:0; left:0; width:100%; }#footer { position:fixed; bottom:0; left:0; width:100%; }The reason to use position:fixed is that it allows the user to usetheir default browser scrollbar to scroll the content, which is muchmore accessible than internal scrollbars. The problem is getting thisto work with older browsers like IE 6. If you really want to consumethe space and you want
to take the time to make this work withbrowsers like IE 6, let us know.Otherwise if you don't care so much about the accessibility part thenyou can just combine some other form of position and give the contentoverflow:auto.I'm sure someone else can explain one of these techniques better than I can. Plus, I'm using an XHTML 1.1 doctype.Are you serving the webpages as mime-type "application/xhtml+xml" ?Because that is the only mime-type that should be used with XHTML 1.1.Otherwise if you are going to use "text/html" then you should useXHTML 1.0 Strict or HTML 4.01 Strict. There are only 3, exactly 3differences between XHTML 1.0 Strict and XHTML 1.1, and unless you areserving "application/xhtml+xml" you should not be using 1.1.If you want to know why there's a thread in the archives all about that.Christian Montoyachristianmontoya.com ... rdpdesign.com ...
cssliquid.com**The discussion list for http://webstandardsgroup.org/See http://webstandardsgroup.org/mail/guidelines.cfmfor some hints on posting to the list getting help**
[WSG] Fixed Height: Headers and Footers
I'm attempting to move a site away from using 10's of nested tables towards using just CSSI have a layout with 3 vertical elements, a header a footer and the contentThe header, obviously sits quietly at the top of the screen but will chane size depending on contentThe content comes next with overflow: auto so that it scrolls as neededThe footer needs to sit permanently at the bottom of the screen.This is fairly easy with a table but i'd like to not use them.Plus, I'm using an XHTML 1.1 doctype. I figured if anyone would know, then it would be you guys.Any ideas?
Re: [WSG] Fixed Height: Headers and Footers
On 12/16/05, CHRISTOPHER MEEK [EMAIL PROTECTED] wrote:
I'm attempting to move a site away from using 10's of nested tables towards
using just CSS
I have a layout with 3 vertical elements, a header a footer and the content
The header, obviously sits quietly at the top of the screen but will chane
size depending on content
The content comes next with overflow: auto so that it scrolls as needed
The footer needs to sit permanently at the bottom of the screen.
What you really want is a fixed header and footer. I'm not sure how
desirable this is since this consumes a lot of screen space, but for
most browsers it's as simple as applying position:fixed to both divs.
So you would have:
#header { position:fixed; top:0; left:0; width:100%; }
#footer { position:fixed; bottom:0; left:0; width:100%; }
The reason to use position:fixed is that it allows the user to use
their default browser scrollbar to scroll the content, which is much
more accessible than internal scrollbars. The problem is getting this
to work with older browsers like IE 6. If you really want to consume
the space and you want to take the time to make this work with
browsers like IE 6, let us know.
Otherwise if you don't care so much about the accessibility part then
you can just combine some other form of position and give the content
overflow:auto.
I'm sure someone else can explain one of these techniques better than I can.
Plus, I'm using an XHTML 1.1 doctype.
Are you serving the webpages as mime-type application/xhtml+xml ?
Because that is the only mime-type that should be used with XHTML 1.1.
Otherwise if you are going to use text/html then you should use
XHTML 1.0 Strict or HTML 4.01 Strict. There are only 3, exactly 3
differences between XHTML 1.0 Strict and XHTML 1.1, and unless you are
serving application/xhtml+xml you should not be using 1.1.
If you want to know why there's a thread in the archives all about that.
--
--
Christian Montoya
christianmontoya.com ... rdpdesign.com ... cssliquid.com
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
