PDA

View Full Version : CSS Backgounds


CalmWaters
April 2nd, 2006, 08:53 AM
Does anyone know how to make the background on a website appear fom the bottom of a page rather than the top, using CSS?

Sinister-wolf
April 2nd, 2006, 09:14 AM
try this, i hope it helps you

<style type="text/css">
body
{
background: #000000 url('image.ext') no-repeat fixed bottom;
}
</style>

reference url : http://www.w3schools.com/css/css_background.asp

rockboy
April 2nd, 2006, 09:25 AM
You can put it wherever you want by specifying background-position. In the example it would be placed at the bottom center.
body {
background: #000000 url(image.jpg) no-repeat bottom center
} I like this page as a reference...
http://www.htmlhelp.com/reference/css/properties.html

Another...
http://www.w3schools.com/css/css_background.asp

Edit: Sinister-wolf, it seems we like some of the same sites. ;)

Sinister-wolf
April 2nd, 2006, 06:03 PM
indeed.. when I find a decent set, i like to sludge it onto my personal website as well,. its a glorified bookmark site....

these pages help with alot when you're designing websites.

hey rockboy.. whats the difference between having it just align bottom fixed and bottom centered

CalmWaters
April 2nd, 2006, 06:24 PM
Cheers for all that, it helped immensly!

Sinister Wolf, anychance I could have a link to your personal site? It doesnt have to be on the forum, it could be PM. I understand if you dont want to give it away though...

rockboy
April 2nd, 2006, 11:10 PM
hey rockboy.. whats the difference between having it just align bottom fixed and bottom centered If you specify fixed it will be static when you scroll the page. In your example it will stick to the bottom of the window even if the page content is scrolled. The default (if not specified) is that the background will scroll with the page. As for location, if I can't remember the default behavior for background location I usually specify where I want it.

Sinister-wolf
April 3rd, 2006, 02:49 AM
Cheers for all that, it helped immensly!

Sinister Wolf, anychance I could have a link to your personal site? It doesnt have to be on the forum, it could be PM. I understand if you dont want to give it away though...
sure .. you can have it..

http://www.coresignsgraphics.com

if there's anything you think I should add, please dont hesitate to suggest.

CalmWaters
April 3rd, 2006, 03:49 PM
Thanks for the caution rockboy but it doesnt matter about that because my website doesn't scroll anyway, its fixed into a screen size. Just for the record is there any kind of element that specifies the backhground to be at the very bottom of the screen at all times even before it's scrolled?

P.S thanks for the site, sinisterwolf, it's got some great stuff on and it looks good!

Sinister-wolf
April 3rd, 2006, 04:21 PM
my posted code will fix it to the bottom, so it WONT scroll at all ever


and thanks for the comment on my site calmwaters. .. I tried to go for simplicity with a touch of class.

I still need to update it a little, i think some people dont like the fact that its not all image glorified, but I was always taught that if site content doesnt load within 10 seconds then the site is too slow..


so thats also why I have only two images on there.. the flash and the menu header image... the flash is 770kb so that makes up for the rest of whatever images would be missing.

CalmWaters
April 3rd, 2006, 04:25 PM
O.K Thanks everyone!