Re: [css-d] Sticky footer - double decker possible?

[Mustafa Quilon]

This method has worked for me on various projects:

http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

There was just too much code in your example, so I did a quick one.
You can extend it.

HTML:


  Your website content here.
  


  
  
Copyright (c) 2008
  


CSS:

* {
margin: 0;
}
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -194px;
width: 942px;
border: 1px solid #000;
}
.push {
height: 194px;
}
.footer {
height: 194px;
width: 100%;
}
.water {
width: 942px;
border-right: 1px solid #000;
border-left: 1px solid #000;
margin: 0 auto;
background: url(ADD IMAGE LOCATION) bottom center scroll no-repeat;
height: 155px;
}
.copyright {
background-color: #ccc;
height: 43px;
}

Hope I haven't misunderstood anything here.

Regards
-
Mustafa Quilon




2009/4/19 Anne E. Shroeder :
> My client has a design comp that I'm finding extraordinarily challenging to
> implement -- the currentt challenge is implementing a sticky footer that has
> two parts AND that maintains a right/left border on the center column (right
> and left column contain no content) that extends all the way down to the
> footer.
>
> Using the methodology described here:
> http://brassblogs.com/blog/sticky-footer  I've been able to implement the
> basic grey line along with the left/right shadows and get the footer to
> stick to the bottom - BUT not the left/right borders to extend down.
>
> Worse, when I add the image of the water on top of the grey line, I find I
> can only put in a min-height to get it to work - which really means it isn't
> working.
>
> When I add in the orange crossbar, everything breaks apart.  Yikes.
>
> Is it possible to code this?
>
> The comp is here: http://www.language-works.com/swim/comp.jpg
> My rather unsatisfactory implementation here:
> http://www.language-works.com/swim/stickyfooter.htm
>
> Anne
>
>
> __
> css-discuss [cs...@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Sticky footer - double decker possible?

[Gunlaug Sørtun]

Anne E. Shroeder wrote:

> http://www.language-works.com/swim/comp.jpg 
> http://www.language-works.com/swim/stickyfooter.htm
> 
> Is it possible to code this?

Think so...




Method used: 

The details (fine-tuning and IE6 hacking) are left to you.

regards
Georg
-- 
http://www.gunlaug.no
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Sticky footer - double decker possible?

[Anne E. Shroeder]

My client has a design comp that I'm finding extraordinarily challenging to 
implement -- the currentt challenge is implementing a sticky footer that has 
two parts AND that maintains a right/left border on the center column (right 
and left column contain no content) that extends all the way down to the 
footer.

Using the methodology described here: 
http://brassblogs.com/blog/sticky-footer  I've been able to implement the 
basic grey line along with the left/right shadows and get the footer to 
stick to the bottom - BUT not the left/right borders to extend down.

Worse, when I add the image of the water on top of the grey line, I find I 
can only put in a min-height to get it to work - which really means it isn't 
working.

When I add in the orange crossbar, everything breaks apart.  Yikes.

Is it possible to code this?

The comp is here: http://www.language-works.com/swim/comp.jpg
My rather unsatisfactory implementation here: 
http://www.language-works.com/swim/stickyfooter.htm

Anne


__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/