HighDots Forums  

Re: Footer doesn't foot

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


Discuss Re: Footer doesn't foot in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Gus Richter
 
Posts: n/a

Default Re: Footer doesn't foot - 06-19-2009 , 02:51 PM






rf wrote:
Quote:
Alex Bell wrote:
Please look at http://citybaptistchurch.net/TestFooter.html and tell
me why the left hand end of the yellow footer hides behind the lime
navigation div when the navigation div extends further down the screen
than the lime contents div.

Because the green bit has position: fixed; clear: both; has no relevance to
prior elements whose position is fixed.

Better still, please tell me how to get the footer to drop below both
the navigation div and the content div irrespective of which extends
furthest down the screen.

Remove position: fixed; from the green bit.
Specifically:

Remove position: fixed; from #navigation
Also:
Remove float: left; from #content

You may also wish to change to padding:1px; in #content to fix the
unwanted collapsing margins.
This far it works also in IE.

--
Gus

Reply With Quote
  #2  
Old   
Gus Richter
 
Posts: n/a

Default Re: Footer doesn't foot - 06-20-2009 , 07:35 AM






Alex Bell wrote:

Quote:
Thanks, Gus. But as I've indicated in another post I really want the
menu to be visible at all times. Is there another way of having that
without fixing it's containing div? I really don't care how it's done as
long as the menu is visible and vertical.

Incorporating position:fixed would cause me to redo the structure of
design. I would start with the banner, followed by the #content with a
left margin for the amount of the #navigation menu, followed by the
footer. I would then, just before </body>, include the #navigation menu
and position it as required (you may prefer to have it as the very first
thing or somewhere in the middle - up to your preference).

But I'll fudge around with the existing markup which will not be as
clean as I would like, however here goes:

#navigation - leave in: position: fixed;
add: left:0;
remove: float: left;

#content - remove: float: left;

body - add: height:100%; overflow-y:auto;

Create a new rule:
* html #navigation {position:absolute;}

Stu Nicholls advises that anything that is position:absolute; or
position:relative; will now be FIXED in IE6 and that the problem with
this is that you cannot use absolute or relative positions on the moving
page but float is allowed. So if this is a problem, search for "IE
position fixed bug" for other workarounds.

Caveat: I have not checked it in IE7 or IE8.

--
Gus

Reply With Quote
  #3  
Old   
Jeff
 
Posts: n/a

Default Re: Footer doesn't foot - 06-20-2009 , 10:56 AM



Gus Richter wrote:
Quote:
Alex Bell wrote:

Thanks, Gus. But as I've indicated in another post I really want the
menu to be visible at all times. Is there another way of having that
without fixing it's containing div? I really don't care how it's done
as long as the menu is visible and vertical.


Incorporating position:fixed would cause me to redo the structure of
design. I would start with the banner, followed by the #content with a
left margin for the amount of the #navigation menu, followed by the
footer. I would then, just before </body>, include the #navigation menu
and position it as required (you may prefer to have it as the very first
thing or somewhere in the middle - up to your preference).

But I'll fudge around with the existing markup which will not be as
clean as I would like, however here goes:

#navigation - leave in: position: fixed;
add: left:0;
remove: float: left;

#content - remove: float: left;

body - add: height:100%; overflow-y:auto;

Create a new rule:
* html #navigation {position:absolute;}
That's interesting.

If this weren't javascript hating group, you could also update IE6 to
either IE& or IE8 using the bit of js I've posted before in this group
with no response. That also fixes first-child and +, which I find very
very useful. I which case the menu could be fixed and the content
relative or absolute.

Quote:
Stu Nicholls advises that anything that is position:absolute; or
position:relative; will now be FIXED in IE6 and that the problem with
this is that you cannot use absolute or relative positions on the moving
page but float is allowed. So if this is a problem, search for "IE
position fixed bug" for other workarounds.

Caveat: I have not checked it in IE7 or IE8.

Reply With Quote
  #4  
Old   
Jonathan N. Little
 
Posts: n/a

Default Re: Footer doesn't foot - 06-20-2009 , 12:07 PM



Jeff wrote:

Quote:
If this weren't javascript hating group,
It is *not* a JavaScript hating group, it just is off topic for this
group which scope is *stylesheets*.


Quote:
you could also update IE6 to
either IE& or IE8 using the bit of js I've posted before in this group
with no response.
JavaScript that would update one's browser? 1) It would need to be
signed script and prompt all kinds of security warnings, and 2) not
possible for non-supporting OSs unless the JavaScript going to update
their Win9x|NT|2000 as well! Or is your phrasing off and you mean
JavaScript to correct IE6's deficiencies.

Quote:
That also fixes first-child and +, which I find very
very useful. I which case the menu could be fixed and the content
relative or absolute.
JavaScript can be used to compensate for bugs, just as long as 1) you
realized that JavaScript may not be available to the visitor and 2) the
functionality of the site should not *depend* on the JavaScript. In
other words, JavaScript can assist or augment a site, not be critical to
its function.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

Reply With Quote
  #5  
Old   
Jeff
 
Posts: n/a

Default Re: Footer doesn't foot - 06-20-2009 , 02:34 PM



Jonathan N. Little wrote:
Quote:
Jeff wrote:

If this weren't javascript hating group,

It is *not* a JavaScript hating group, it just is off topic for this
group which scope is *stylesheets*.


you could also update IE6 to either IE& or IE8 using the bit of js
I've posted before in this group with no response.

JavaScript that would update one's browser? 1) It would need to be
signed script and prompt all kinds of security warnings, and 2) not
possible for non-supporting OSs unless the JavaScript going to update
their Win9x|NT|2000 as well! Or is your phrasing off and you mean
JavaScript to correct IE6's deficiencies.
I've posted this here before, and nobody commented:

http://dean.edwards.name/IE7/

I now use it in most new work. I'll let you guys struggle with
numerous IE6 hacks and convoluted methods of getting equal height
columns. I've got work to do.

Quote:
That also fixes first-child and +, which I find very very useful. I
which case the menu could be fixed and the content relative or absolute.

JavaScript can be used to compensate for bugs, just as long as 1) you
realized that JavaScript may not be available to the visitor and 2) the
functionality of the site should not *depend* on the JavaScript. In
other words, JavaScript can assist or augment a site, not be critical to
its function.

And if a site looks a bit different in the 5% of the 25% of IE6 users
with js off. Who cares? I've recently heard it argued here to ignore IE
altogether.

Jeff
>

Reply With Quote
  #6  
Old   
dorayme
 
Posts: n/a

Default Re: Footer doesn't foot - 06-20-2009 , 05:44 PM



In article <h1j1i9$43n$1 (AT) news (DOT) eternal-september.org>,
"Jonathan N. Little" <lws4art (AT) centralva (DOT) net> wrote:

Quote:
Jeff wrote:


you could also update IE6 to
either IE& or IE8 using the bit of js I've posted before in this group
with no response.

JavaScript that would update one's browser?
"update' is terminology used by the bloke who wrote this js. It is
natural enough in the context of his pages I guess.

--
dorayme

Reply With Quote
  #7  
Old   
Jonathan N. Little
 
Posts: n/a

Default Re: Footer doesn't foot - 06-20-2009 , 06:04 PM



Jeff wrote:

Quote:
And if a site looks a bit different in the 5% of the 25% of IE6 users
with js off. Who cares? I've recently heard it argued here to ignore IE
altogether.
Look a little strange == acceptable

(No look at all | unusable) == unacceptable


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

Reply With Quote
  #8  
Old   
Alex Bell
 
Posts: n/a

Default Re: Footer doesn't foot - 06-21-2009 , 03:01 AM



Gus Richter wrote:
Quote:
Alex Bell wrote:

Thanks, Gus. But as I've indicated in another post I really want the
menu to be visible at all times. Is there another way of having that
without fixing it's containing div? I really don't care how it's done
as long as the menu is visible and vertical.


Incorporating position:fixed would cause me to redo the structure of
design. I would start with the banner, followed by the #content with a
left margin for the amount of the #navigation menu, followed by the
footer. I would then, just before </body>, include the #navigation menu
and position it as required (you may prefer to have it as the very first
thing or somewhere in the middle - up to your preference).

But I'll fudge around with the existing markup which will not be as
clean as I would like, however here goes:

#navigation - leave in: position: fixed;
add: left:0;
remove: float: left;

#content - remove: float: left;

body - add: height:100%; overflow-y:auto;

Create a new rule:
* html #navigation {position:absolute;}

Stu Nicholls advises that anything that is position:absolute; or
position:relative; will now be FIXED in IE6 and that the problem with
this is that you cannot use absolute or relative positions on the moving
page but float is allowed. So if this is a problem, search for "IE
position fixed bug" for other workarounds.

Caveat: I have not checked it in IE7 or IE8.

Thanks, Jeff and Gus. I've printed out your suggestions and will study them.

--
Regards, Alex

Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.