add background image - shadow

Hi

I use this code in template.css to add a background and have shadow in background:


body
{
margin:0;
padding:0;

background: url(../images/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
/*
* Basic font-size and line-height
*/

#gk_wrapper {
font-size:1.2em;
line-height:1.5em;
width: 1004px; margin: 50px auto; padding: 20px; background: #fff; -moz-box-shadow: 0 0 20px black; -webkit-box-shadow: 0 0 20px black; box-shadow: 0 0 20px black;
padding: 0 10px 10px
}


every browser (Firefox, Chrome, Safari, Opera) shows it perfect except IE7 & IE8..

please mail me for password

Hi

This part of the code is not recognized by IE (lack of support for CSS3).

I shouldn't be helping with that since it's a customization issue but please send me an access and link to Your site.

Hi

Och. I can see You did send me this information right after writting this post

You need to use an image for this shadow to work with IE.

Simply make a screenshot throught the whole visible space with a shadow and use it as backgorund with parameters: repeat-y top center.

if you are reffering to the background image, this solution is not possible to worh (I think) in every screen resolution.

If you mean that I can create some transparent pngs (..containing the shadow) please inform how can I input them around the wrapper (mainly on the top right and bottom egdes of wrapper)


thanx

Hi

Exacly the same as I've told above, but You should create a new layer just for this shadow. Simply add it before starting body tag and after ending tag. In css give it's a left and right padding with the width of the shadow and make the whole new layer centered with margin left and right set to auto. With the code I've already told You for the body, but used with this new layer all will shown as You requested.

Hi

One more thing.

You won't be able to fit the backgorund for every resolution so the only way is to use the image for the hightest resolution possible or ended with one color and simply use this one color as the rest of site's backgorund.

PS: You gave me a nice idea to create a module which will make backgrounds fit to the resolution. I need to see how online compression works for the images quality and size