Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   HTML (http://www.velocityreviews.com/forums/f31-html.html)
-   -   Footer not being pushed to bottom in CSS layout (http://www.velocityreviews.com/forums/t392222-footer-not-being-pushed-to-bottom-in-css-layout.html)

Chris 02-20-2007 11:54 PM

Footer not being pushed to bottom in CSS layout
 
If you go to http://194.129.129.161/test.htm Can anyone tell me why my
footer in my layout is not pushed down beneath the textual content div. The
footer div in IE 7 and Firefox goes across the top of my text even though
the div appears beneath the text div.

This will form the basis of a database driven system so I will not know how
big the text will be. I have posted link as it is little difficult to
explain. Regards, Chris.





Rik 02-21-2007 02:08 AM

Re: Footer not being pushed to bottom in CSS layout
 
On Wed, 21 Feb 2007 00:54:58 +0100, Chris <nospam@btinternet.com> wrote:

> If you go to http://194.129.129.161/test.htm Can anyone tell me why my
> footer in my layout is not pushed down beneath the textual content div.
> The
> footer div in IE 7 and Firefox goes across the top of my text even though
> the div appears beneath the text div.
>
> This will form the basis of a database driven system so I will not know
> how
> big the text will be. I have posted link as it is little difficult to
> explain.


Because you have given the #content a height that's not big enough to hold
the text. The text overflows, the box will not grow according to the
specs, as it has a set height. Remove the height, and you're fine. I think
you meant to use min-height, then again, MSIE6 does not know min-height...
It treats height as min-height.
--
Rik Wasmus

Roy A. 02-21-2007 02:12 AM

Re: Footer not being pushed to bottom in CSS layout
 
On 21 Feb, 00:54, "Chris" <nos...@btinternet.com> wrote:
> If you go tohttp://194.129.129.161/test.htmCan anyone tell me why my
> footer in my layout is not pushed down beneath the textual content div. The
> footer div in IE 7 and Firefox goes across the top of my text even though
> the div appears beneath the text div.
>
> This will form the basis of a database driven system so I will not know how
> big the text will be. I have posted link as it is little difficult to
> explain. Regards, Chris.


Your document is encoded in windows-1252. Try to use utf-8 or include
<?xml version="1.0" encoding="windows-1252"?>
in you document.

Use 'min-height:400px' insted of 'height:400px', or no height at all.

Put the styles in a stylesheet and use an IE conditional comment

<!--[if lt IE 7]>
<style type="text/css">
#navigation { height: 400px }
#content { height: 400px }
</style>
<![endif]-->


Chris F.A. Johnson 02-21-2007 02:14 AM

Re: Footer not being pushed to bottom in CSS layout
 
On 2007-02-20, Chris wrote:
> If you go to http://194.129.129.161/test.htm Can anyone tell me why my
> footer in my layout is not pushed down beneath the textual content div. The
> footer div in IE 7 and Firefox goes across the top of my text even though
> the div appears beneath the text div.


When I see height and width specified in px units, I automatically
assume that that is the cause of the problem. And usually it is;
your page is no exception.

Because of fixed widths, your page works *only* in an 800px-wide
window.

See a modified version of your page at:
<http://cfaj.freeshell.org/testing/test.htm>.

> This will form the basis of a database driven system so I will not know how
> big the text will be.


If you don't know how high the text is going to be, why do you use
fixed heights (measured in px)?

> I have posted link as it is little difficult to explain.


That's the right way to do it.

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
================================================== =================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)

Roy A. 02-21-2007 04:14 AM

Re: Footer not being pushed to bottom in CSS layout
 
On 21 Feb, 03:12, "Roy A." <royarnes...@gmail.com> wrote:

> Use 'min-height:400px' insted of 'height:400px', or no height at all.
>
> Put the styles in a stylesheet and use an IE conditional comment
>
> <!--[if lt IE 7]>


It should be: if "less than" IE 6: <!--[if lt IE 6]>

"With Internet Explorer 7, the min-height/max-height properties apply
to floating and absolutely positioned block level elements and inline-
block elements, as well as some intrinsic controls."

http://msdn.microsoft.com/workshop/a.../minheight.asp


Chris 02-21-2007 11:22 PM

Re: Footer not being pushed to bottom in CSS layout
 
Thanks alot :)

"Chris F.A. Johnson" <cfajohnson@gmail.com> wrote in message
news:7hmsa4-l2j.ln1@xword.teksavvy.com...
> On 2007-02-20, Chris wrote:
>> If you go to http://194.129.129.161/test.htm Can anyone tell me why my
>> footer in my layout is not pushed down beneath the textual content div.
>> The
>> footer div in IE 7 and Firefox goes across the top of my text even though
>> the div appears beneath the text div.

>
> When I see height and width specified in px units, I automatically
> assume that that is the cause of the problem. And usually it is;
> your page is no exception.
>
> Because of fixed widths, your page works *only* in an 800px-wide
> window.
>
> See a modified version of your page at:
> <http://cfaj.freeshell.org/testing/test.htm>.
>
>> This will form the basis of a database driven system so I will not know
>> how
>> big the text will be.

>
> If you don't know how high the text is going to be, why do you use
> fixed heights (measured in px)?
>
>> I have posted link as it is little difficult to explain.

>
> That's the right way to do it.
>
> --
> Chris F.A. Johnson <http://cfaj.freeshell.org>
> ================================================== =================
> Author:
> Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)





All times are GMT. The time now is 03:43 AM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.