March 31, 2005
This is the second page I have done using CSS for postioning and I am still a green footed newbie. My problem is this. My footer, along with everything else, is in a white background-toting wrapper div which helps cover up any unsightly gaps in my other divs. This also makes my right-sided sidebar and my left column content area keep to their assigned column space and end together when one is longer than the other. The footer, originally done in a table, is capped off with two little gifs that make the white column look rounded off at the end. To my chagrin, the wrapper div keeps on going for a few pixels in Explorer 6.0, making a white rectangle attached to the end of the column. What can I do to eliminate this? Doesn't happen in Firefox. For example of the original table-based layout, see this
-
Can you show us the page? Meanwhile, IE6 has this weird extra-pixels thing on margins and the like. I find it really helpful to place * { padding:0; margin:0; } at the top of every stylesheet I make. You have to then manually set every margin and padding, but it gets rid of a lot of cross-browser issues.
-
Here is the test page. The header and footer are just straight out gifs. Here is the positioning css.
-
Are you sure your #footer rule is syntactically right? It seems to be missing a close-brace.
-
What fuyugare said about the brace. If that doesn't fix it, give the footer a negative bottom margin equal to the height of the images. So, if the images are 5 pixels tall: margin-bottom: -5px; You might have to play with that value but it should work. You really should run that page through a validator too. You've got markup problems. And check the CSS for any other problems.
-
Oh, I forgot. You can rounded corners using CSS too: http://virtuelvis.com/gallery/css/rounded/ It uses 24bit PNGs so it might not be an option if it has to look the same in every browser.
-
I made the bottom margin -5px and it worked like a charm in Explorer... I'll need to get back to my desk to check in Firefox and Opera. Thanks, everyone for your helpful suggestions. The code is messy right now, especially the sidebar since it is an ssi that exists for our current tables-based site. I'll be cleaning it up in the next few days. Thanks again!
-
why are you using css?
-
About 2 years ago, the Gov.'s office decided on a new standard for all Alaska state pages. They gave everyone a very short deadline to be a certain percentage compliant with the new look. It caused a huge panic in some departments and many people are now struggling to meet the 100% compliant date at the end of June, including me. I don't want to go through this again in about two years when a new design is mandated. I am using server-side includes for the set elements of the page and positioning everything with css, setting the stage for an easier transition next time. A side benefit is better access for people using readers for the blind. The problem is I am a web design idjit. Hence, the cry for help.