Greetings,
I have installed Omeka 2.0 and installed the theme Seasons Fall. I have been hacking up the CSS file to get it match the colors I need and adding background image files. So far so good until I got to the footer image. I cannot get it to repeat down at all and instead I get huge white spaces on pages that don't have much content. Any ideas on how I get rid of this to make the footer image repeat to fit screen size? I have a image saved here so you can see what I mean. http://goo.gl/MZ3GCy
And here is the style.css code for the footer in the theme autumn.
.autumn footer {
background-image: url('footer-wrap-red.png');
background-color: #620000;
}
.autumn footer p {
color: #480000;
}
Thank you! I appreciate any help possible.
Is the background-repeat property what you're looking for?
http://www.w3schools.com/cssref/pr_background-repeat.asp
No. I have tried the background-repeat:y and background-repeat:x and neither one had the desired affect.
So far the only success I have had at eliminating the white space is to add more content until in the body until it is enough that the footer is pushed all the way to the bottom of what ever screen size I am currently viewing it on. Smaller screens do not have the problem.
The footer is rendered after the content, so if there is not enough content to push it down to the bottom of the browser window or past, it will show the page below the footer. This is just the way HTML is rendered. I've seen some tricks used over the years to pull the footer down to the bottom of the browser window, but I just live with it, since most pages have enough content that this "high footer" doesn't occur.
If there is a url available on the web, that'll help us diagnose what's happening by looking at the CSS in the browser inspector. And, if the background is a solid color, maybe just setting the color, without an image would work (but my CSS-fu is not especially strong)
Here is the actual URL. Its only on bigger screens that you get this. Now if you submit a search and get 0 results, you may see it. I just tested it on another laptop and and first you wouldn't have seen the issue. It wasn't until I found a page that didn't have enough content to push the footer all the way down that you see the white space.
http://libprod.morningside.edu/omeka/
Thank you for the help!
Got it!
If you add position: inherit; under the .autumn footer and then add width 100% under the footer element it works!
Thanks for the help.