Hallo all, I can has issues with a footer I've got. In re-doing a site which was built in tables, I've tried to keep the design as much the same as possible. This included a fixed-to-the-bottom-of-the-viewport footer. Of course, IE6 doesn't play nice so for it I thought I'd just give it position: absolute and bottom: 0 and all would be well. But... First, the footer is a direct child of the body. Second, it's pretty much first in source. I would sure like to keep it like this if I can, because it has the handy ability to set the navigation as first in text-browsers and screen readers and bots. There is no other navigation, as the original site only had it in the footer. The body is already position: relative, 100% height, and the footer in IE is sticking to the bottom of the viewport which it may NOT do. It should be sitting at the bottom of the body (which of course should be as high as all its content, and IE knows that 100% means 100% + whatever the content adds). The only solution I've thought of so far was to move the footer back to LAST in source, which I'd rather not, so that it can then be position: relative and sit at the bottom like a normal footer. pseudo html: <body>(html, body height: 100%) <footer>plus menu etc</footer>(pos:fixed for everyone xcept IE6 pos:abs) <container>(height, min-height: 100% also flex-width) <header></header> (100% width) <wrapper>(float left, 100% width for sidebar wrapping trick... bottom padding for footer) <content></content> </wrapper> <sidebar></sidebar>(float: left, negative margin for wrapping up to wrapper) </container> </body> All other browsers, even Konq and IE7, are cool with the footer (for them, it's position: fixed). Does anyone know of what I could possibly tell IE6 so that it keeps the footer at the bottom of all the content instead of the bottom of the viewport? This problem doesn't come up at normal resolutions but my whole set-up of this page was to include 800x600 resolutions. If it doesn't work at this resolution, I consider the page a failure. Please no links to stickyfooters, they use a different technique which most importantly has the footer last in source. I've already beaten that horse with some other pages : ) The thing is, I didn't have it earlier. But I've made so many changes I don't remember which combination it was.
Stomme, I just speed read your post. So if I'm addressing the wrong problem, don't beat me up. Here is a tutorial on how to 'fake' position:fixed in IE6: http://web.tampabay.rr.com/bmerkey/examples/fake-position-fixed.html It seems to work really well.
First of all, I want to talk you out of a fixed footer. Consider that it's taking up expensive real estate better used by your content. Another consideration for some is that using fixed position really burns cpu cycles during a scroll. A slow, or memory challenged machine will have a jumpy scrolling action—kinda ugly. Second, putting the links before your content can be detrimental to search results. I do agree users of assistive technology should have ready access to the menu, just as they should have ready access to the content (the more usual issue). Please view two pages of mine. The html and css workshop page has its menu source ordered after the main content. Notice the link that takes the visitor to the top of the TOC. That's an alternative to having the menu first in source and a jump link to the content, which is what you want. Then look at my footer at the bottom demo. This footer demo is a bit different from the better known alt-stick whatever. Notice the footer is a child of the top level div element (#container). There is no reason you couldn't move the footer code to above the #main content, as opposed to leaving it following after. cheers, gary
Is there something missing in your second link, Gary? The second one, I've seen before (you have a... unique style of tabbing : ) The skip to the toc is a good idea... this particular site I'm writing doesn't address what happens to someone with a linear browser who's gotten to the bottom and now wants to click a link (I'd have to have a "back to top" or "skip to footer" link of some sort). It's really the first site I've had to rewrite that was kinda set up goofy, with no normal menu or anything. Although it's a sort of house-search site, the idea being that people will want to use the search in place of the menu most times. I'm currently working on one of the "house" pages, and those can get veeeeery long (filled with all the info the owner has filled in, in a long long list). Kinda the main reason the guy who runs this business wants the sticky footer, so the menu is available no matter how far down you scroll. Here's the page I must imitate: www.secondhomerentals.com where they do have the footer at the bottom and position: fixed for everyone but IE6. I figured, normally I have a menu at the top, but there's no menu here but the footer, and since in any case I have the footer as a direct child to the body (which was indeed sorta like Foo's link where we fake position: fixed in IE6 by making it a child of the body and telling it position: absolute, bottom: 0), I thought I could have it at the top. (by the way, completely disregard the fact that my colleague thought he was doing the right thing by sticking XHTML 1.0 strict on this complete non-semantic, table-built, center-tag-loving, non-commented JS-filthing, steaming pile of code... semantic, valid and well-formed HTML is NOT his forté ) I'm not sure if the menu at the top is bad for accessibility. It should be no problem for any SEO stuff since, maybe stupidly, the first two links just go to the main page anyway. I don't have a "slow" machine to try this out on, and didn't think of the jumping and scrolling. That's good to keep in mind, though I could hope that in a country where 90+% of user have Windows, they would be using IE6 or below on their old machines (which won't scroll of course). To keep the current design, I will still have to have the scrolling footer. The guy who's sorta our salesman (the main guy behind this company) thinks it looks "professional" and while I've been able to stall on the Flash intro spash pages and whatnot, this one is too small a battle to spend energy on. What I have (other pages aren't finished yet, as they got stopped when this footer thing appeared): http://stommepoes.nl/Homeselling/secondhome/secondhome.html If IE6 is at a 1024x768 or higher resolution/screensize (either), the footer seems to know where the bottom of the body is. Of course, who's likely to have IE6 at such a resolution? Someone with an old machine which will be doing the jiggy too... ack. You know how it's like when you think you have just have your way, cause 99% of everything works just the way you want, but then this one thing comes along...? Of course you hope you can just fix the one little thing instead of completely changing everything. If I absolutley can't feed some other line of BS to IE6, I indeed will have to move the footer to bottom of source. : (
There's absolutely nothing wrong with that link! It works perfectly for me. That you're not on my intranet, where you could see my development server is not my fault. You could have followed the link in the other page, but here's the public link. http://gtwebdev.com/workshop/layout/footer-bottom.php Aside: How should we address you? "Stomme poes" holds no clue to its meaning among us parochial 'Mericans. Part of the problem lies in Dutch sounding as if we should know what's being said. I guess that's from the long political alliance between England and the Netherlands against Spain in the 17th century, and Orange ruling England in the late 18th century. Lots of language interbreeding. cheers, gary
I went ahead and clicked your original link again. This time, I ended up at http://www.koko.uk.com/ there's a marquee in it, didn't look like yours : ) I think the problem with the link is the lack of a .com or .whatever somewhere. Also, Paul O'B looked at my page and said he couldn't replicate the error. Now the funny thing is, I remembered that earlier I was doing a bunch of width tests, making sure all my crap (forms etc) fit when the browser was down to 800X600 (below that, scrollbar). The footer never gave me any lip then. Since that time I have played with the menu to get it to fit more cross-browser (if it wraps, like during a text-enlarge, it's gone) and stuck a little image abs: pos (sorry, my pride working here : ) I'm thinking one of those things screwed with my footer. For sh*ts and giggles I took a look in IE5.5 (all my IE's be Tredosoft except 7 and 6 on the Linux machine). There, even at a large resolution or screen width, the footer is flaky. As well as some other things (scrolling can set stuff in a tizzy, colours getting chopped off and then coming back... bah). I must be making that rendering engine work too hard. : ) Anyway, if this ends up being a local issue, then I might be able to leave it. However I was warned that IE will have more trouble finding the bottom of the body when the content is generated. My pages are static, but when moved over to the work server they will indeed become dynamic. So, I may be forced to move the footer down anyway. It's not like I can keep the purity of my code anyway, since my colleague adds scripts (sitting bare, no decent commenting out for XHTML) and other BS that doesn't belong on my lovely pages. Long political alliance... except when England took the shipping trade away from the Dutch and the Dutch went to war against, let's see, almost everyone at some point... Spain of course, but also France (when they weren't ruling the Low Lands), England, and the German lands. That said, I've heard from a language instructor that Frisian (which isn't Dutch but is spoken in the north) is the closest language to Old English (dunno if he meant closer than modern English). If you ever learn Dutch, you'll discover the answer to a lot of "why"s you might have about English. Do you know why a day is "muggy"? Or why prepositions are all out of whack (up the streen, down the street)? Or why you have all those silent letters like "gh" (night, brought, freight)? A lot of things that used to be in English have stayed a little better over the centuries in Dutch. Stom means "stupid". Poes (oe in Dutch is oooo) is "cat" (and used interchangebly with "kat"). For grammar reasons, stom becomes stomme, so, Stupid Cat. It's a phrase I say daily to our cat, who is chronically afflicted with Stupid. It's also how I felt when I first started with HTML and CSS in May? June? of last year. There's nothing wrong with saying "stomme" or "stomme poes". But one time deathshadow said something like, "I'm akin to stomme" and it sounded like he was saying he was stupid. Woops. I don't know how many Dutch speakers on on the forums... I think there are more on Site Point... but it doesn't bother me how you use it. Now, my guess: kk5st is a ham radio name/license? Though I see it went away at cc.
Hah, about a century and a half ago, when I was a teen, a cat took up with my mom (that Mom kept feeding it might have been pertinent). We all referred to it as "that stupid cat", which soon became shortened to a proper noun, "Stupid". You're right about the call sign. In '98, I came down with GBS. The resulting palsy from nerve damage meant that I could no longer write or type or send CW (Morse code). Since my favorite Ham activity was traffic handling by CW, when my license term ran out in 2005, I didn't renew. The name change at CSSCr was because I could (it's good to be the king^H^H^H^H mod). In re the koko address, you missed this, "That you're not on my intranet, where you could see my development server is not my fault." My machines are named for blues singers of the female persuasion, koko [Taylor], etta [James], aretha [Franklin], bessie [Smith] and [Memphis] minnie. The local network is blues, thus koko's canonical address is koko.blues, which is not a public address. Have you considered promoting yourself to project manager so you could impose coding standards? cheers, gary
Small company, I was asked by my friend (the colleague) to redesign the craptastic website (cause I can draw), so I learned GIMP and that did nothing, so I learned HTML and CSS and rewrite the sites (I rarely make new sites). But once I send them to him so he can put them on the server, they're out of my hands. So he later adds stuff, and I tell him, you can't do that! But usually it's more like, "I don't want you to do that" so he ignores me. Our pages will never go through an XML parser, so getting him to properly comment out scripts is hard. Getting the scripts out of the HTML entirely is impossible. I don't write Javascript, and while I found several articles on how to keep your scripts external and use Event Handlers, I can't do that for him and he's still in the <body onload()> world... just the way it is. He added coloured buttons to tell people what state their policy is in (accepted, rejected, in handling). Ack! Now I need to fix THAT... always something. I have to see it to catch it. But everyone there does already know I'm a Nazi about such things. The running joke in the office is "Well, now the blind can buy insurance for their cars and scooters online!". Har har. *edit, as far as the footer goes, I think I'm forced to move it to last in source. While my pages are static, the site is dynamic. IE will have even more trouble figuring out where the bottom of the body is, and I've found that 5.5 really has issues with it (like 6 but does it all the time, at all screen sizes). I've got skip links at the bottom, so I supposed I'll move them to the top of the page instead. Bah.
Apologise? I chose the name! Stomme, or poes... if Russian guy comes on here with a name that means "retard pr0n king" of course I'm still going to call him that. : )
Gah! Moving the footer to last in source still doesn't help IE5.5-- was position: absolute ever referred to the viewport instead of the body in IE5x? But 6 seems --so far-- to be able to keep it at the bottom... hopefully when my code goes into the template where content is generated, IE6 can still keep its sh*t together. I'll keep playing with position:relative on various things to see what happens... I also removed the floats from my menu in the footer to see if that helped (no). I'll also try that Javascript Paul O'B gave me just to see if it helps Javascript-enabled IE's esp 5... it emulates position: fixed for them meaning the footer might be able to stay out of the way.
. I had an African friend read a thread on here in class, and he kinda speaks dutch, and he thought it was Stupid Vagina. (Here, pussy is slang for vagina), so thanks for telling me what it really means...
Yeah "pussy" works both ways in Dutch too. But at least in my house, it always refers to the cat. Plus, "stom" in its older form means "dumb" as in "mute", non-speaking... used earlier more for animals, where "dom" meant definitively not smart.
Great HTML / CSS workshop as I think I will learn a lot of stuff that's been plaguing me for a while!