css right left image issue

[buxmike]

Having an issue creating images. Would like one on right and one on left, ( over the main background image ) however, no matter what I place in, only shows on right, left but never both?

I know I'm doing something wrong, just not sure what it is.

Wordpress css



body {
color:#cdc9c9;
font-size:12px;
font-family: 'arial';
position:relative;
background:url("images/back-body.jpg") top no-repeat;
background: url("images/bg-left.png") no-repeat;
background: url("images/bg-right.png") top right no-repeat;




text-shadow:1px 1px 1px #202020;
}

[buxmike]

floating would also be great/ if possible so it moves with page when scrolled.

Thanks in advance.....

[ajfmrf]

Please post a link to the page on your site that contains the problematic script so we can check it out.

It will make getting help a lot easier/faster

[buxmike]

RE:

[QUOTE=ajfmrf;295663]Please post a link to the page on your site that contains the problematic script so we can check it out.



Sorry, I never know if they are allowed or not:

kentuckyweedradio.com

[Beverleyh]

It looks like the syntax is incorrect - multiple background values should just be comma-separated.
background: url(sheep.png) center bottom no-repeat, url(betweengrassandsky.png) left top no-repeat;See http://www.css3.info/preview/multiple-backgrounds/

[buxmike]

So would this be correct then?


body {
color:#cdc9c9;
font-size:12px;
font-family: 'arial';
position:relative;
background:url("images/back-body.jpg") top no-repeat,
background: url("images/bg-left.png") top left no-repeat,
background: url("images/bg-right.png") top right no-repeat;

text-shadow:1px 1px 1px #202020;
}

[buxmike]

The above code , dose not show, right or left image?

[Beverleyh]

So would this be correct then?


body {
color:#cdc9c9;
font-size:12px;
font-family: 'arial';
position:relative;
background:url("images/back-body.jpg") top no-repeat,
background: url("images/bg-left.png") top left no-repeat,
background: url("images/bg-right.png") top right no-repeat;

text-shadow:1px 1px 1px #202020;
}

No that's still not the correct syntax. Look carefully at the sample code I posted (from the linked resource) and you'll see that there is only one background property with multiple, comma-separated values listed after it. Here's that sample code again for reference;
background: url(sheep.png) center bottom no-repeat, url(betweengrassandsky.png) left top no-repeat;

[buxmike]

worked! Thank you.

If I may ask, where can I add float to keep inframe.

Meaning when someone scrolls down the site, the two images

right / left don't move.

Thank you.

[Beverleyh]

You just need to add the background-attachment value of "fixed" into your CSS shorthand. See here for reference: http://www.dustindiaz.com/css-shorthand/

[buxmike]

Your Awesome !


Thank you.

[buxmike]

Resolved.