View Full Version : Resolved Footer floating, squiggly character problems
12-15-2009, 06:23 AM
Hey everyone, you can see my site under development at http://topnotchwebservices.com/p_cantest/ , when you view the site the footer doesn't stay at the bottom, I can't figure out how to get it to stay there, also above the navigation bar it has weird characters. If it helps both the navigation bar and the footer are using SSI. Any ideas how to get rid of the characters and keep the footer at the bottom? thanks
12-15-2009, 06:41 AM
did you validated your page.
it has 2 doctypes tags and 2 body tags, 2 <html></html> tags.
why are they repeating.
they should be one.
12-15-2009, 06:43 AM
Try it like this -
clear: both; /*this makes it not go next to a float*/
/*float:center; no such thing, floats don't work with relative or absolute positioning if there was*/
Here is what shows in your rendered code on my end - <div id="leftnav">
Could be in your markup or your include. Can you quote that section of HTML here? Quote the full include too.
Have a look at the 34 errors (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Ftopnotchwebservices.com%2Fp_cantest%2F)the validator finds. Read about validation in the links in my sig below.
12-15-2009, 06:45 AM
oh yeah, that. I forgot to take that out of the footer, as its a seperate file and expression web put that in. I haven't validated my page yet, no.
12-15-2009, 06:52 AM
below is that section of the HTML:
<!--#include virtual="includes/navigation.html" -->
and here's my include it's pointing to:
<li><a href="http://www.website.com">Contact Us</a></li>
<li><a href="http://www.website.com">Tour to Victoria</a></li>
12-15-2009, 07:13 AM
awesome, thanks Excavator but the validator helped me get rid of the squiggly things. Now its just the footer....it appears at the bottom but it wont appear at the bottom in IE until about 20 seconds after the pages loads...any ideas on this?
12-15-2009, 07:27 AM
It appears to be hiding behind your #container. IE8 in compatablity mode doesn't show it at all.
Add overflow:auto; to the CSS for #container to clear it up.
12-15-2009, 07:38 AM
I added overflow:auto; to my css file for #container but it doesn't seem to be doing anything.
12-15-2009, 07:50 AM
Remove position:relative; from #content. You have a very persistent bug caused by your positioning.
To see better what's happening, put different background colors on your #footer, #content and #container.
12-15-2009, 07:53 AM
Have a look at a simple 2 column layout demo here (http://nopeople.com/CSS/equal_length_columns/index.html).
12-15-2009, 08:18 AM
Thank you so much Excavator for your help, I owe you one big time!
12-15-2009, 08:20 AM
No problem, glad to help.
Did you look at the 2 column example I linked to? That is probably a much better approach.
12-15-2009, 08:22 AM
Yes, I did. Learned some things from it too. Now my next goal will be to tweak my CSS so it's not so buggy, lol.