Fruitful Theme - How to get the footer to stay down?

Permalink
Hi!

I am working on a basic website, and I found that the Fruitful theme seemed to be perfect for what I needed. I'm not great at CSS (I'm more of the visual design end of things, and I never learned CSS. I understand HTML, though), but I can dig into the code enough to make changes/understand (a bit) what is happening.

I have dug through several tutorials that address this issue, but I am beginning to think it's a theme issue that has no solution.

How do I get the footer to stay down!? Here's a link to my site.http://uniquetouchtm.com/dev/

I have tried just about every tutorial out there with this one being the closest to being successful.http://www.lwis.net/journal/2008/02/08/pure-css-sticky-footer/...

I got it to work in my Chrome browser, and was thrilled! Then, I went to replace my CSS file on my site (this is a dummy site, not the real thing yet), and the footer ended up back in the body (but it kept the code that I had added in the CSS). I'm starting to think that, even though I am terrible at coding, I should've just built a site from scratch. It's been kicking me in the shins all week.

Any ideas? I know I probably have to edit more than one file for this, but I don't even know where to begin.

Thanks in advance!

JennyDillBrown
 
sparky94 replied on at Permalink Reply
Try adding content to fill the page
JennyDillBrown replied on at Permalink Reply
JennyDillBrown
All of the pages now have content, and it is still a problem for those that have a smaller amount of content.
MrKDilkington replied on at Permalink Reply
MrKDilkington
Hi JennyDillBrown,

You can try this with the Fruitful theme. It will require modifying the HTML in the template files. The CSS can be added through Custom CSS.

Before making any major changes, back up your files.

http://css-tricks.com/snippets/css/sticky-footer/...
http://www.concrete5.org/documentation/using-concrete5-7/in-page-ed...

* {
  margin: 0;
}
html, body {
  height: 100%;
}
.page-wrap {
  min-height: 100%;
  /* equal to footer height */
  margin-bottom: -138px; 
}
.page-wrap:after {
  content: "";
  display: block;
}

To save you a lot of time and frustration. If you only know HTML, I don't recommend trying to make your own theme from scratch.

As a visual designer, or graphic designer, you will be greatly benefited by learning CSS.
JennyDillBrown replied on at Permalink Reply
JennyDillBrown
The Fruitful theme that I have is not customizable, it would seem. So, that makes adding the Custom CSS challenging.
MrKDilkington replied on at Permalink Reply
MrKDilkington
You can add CSS directly to the theme stylesheet.

fruitful\themes\fruitful\css\iGotStyle.less
JennyDillBrown replied on at Permalink Reply
JennyDillBrown
Thanks for all your help, guys! I appreciate it.

I struggled with this for awhile before I just gave up the fight. I added content to help push it down, but it doesn't really do the trick for all browsers. I don't know if it's my lack of skill, the theme, or 5.7.3.1. I've run into a few brain busters on this project.

I dug into the CSS, too, and it seemed like no matter what I did to change it/develop it locally, it would work fine until I uploaded it to the server. It made me a bit nutty. Some battles, I guess, aren't worth it. This is why I don't do this job all the time! I don't know enough yet.