link:
http://test.scic.com/files/durable/mypage.html
When you click the link “See and edit all information”, the left sidebar background doesn’t expand down. I also want the footer stuck to the bottom.
What am I doing wrong here?
For starters, you cant use the STYLE tag within the BODY tag. The class .clearboth may be being ignored and thus your container collapses. Second, make sure the bg graphic ( sidebar and otherwise) is part of the container and not assigned to the sidebar… this is the technique known as faux columns.
Yes, check out Faux Columns to keep your sidebar full height. In terms of the footer always at the bottom, this is tricky, but there is a way to do it, as detailed here:
However, and simpler way (and better in my opinion) is to set the footer color as the background color of the body element, so that the footer sits at the bottom of the content but then there’s no color gap under the footer on short pages.
Was unsure about that, will move it and see if it makes a difference. Didn’t know about the faux columns article will check it out.
Thanks.
@dresden_phoneix, @ralph.m, Even after reading those articles on faux columns, I still can’t make hide nor hair of how to get this correct. How would I make the faux columns trick work with the 960 grid system?
I mades some mods to the mypage code but now the footer doesn’t adhere to the bottom.
I have another page where I set everything the way it was originally and made the background image tall (1600px).
http://test.scic.com/files/durable/mycontactus.html
It is just confusing as to why, with a height of 100%, it (sidebar div) doesn’t fill it’s container.
Any other ideas?