Main window shift - Floating main window

[hardwiredtemplates]

Hello everyone

I am having this strange issue a very simple task yet I am unable puzzled.

Template: Lite Red
Site: www.megasaveonline.com

All I want is to move the main/body(the white area) down a little but keep the gray background in it's place. I've tried many attempts suggested by other posts but in most cases the whole thing shifts down or it seems that I've increased the logowrapper space

I just want the white area shifted down - as if its floating within the gray area(image).

Thank you all so much

[kobra]

Try fixing the background and adding a margin to the body

I also do not see where you have a class defined for .body-bg
See highlighted

body {
	margin: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 0.72em;
	color: #333333;
	line-height: 17px;
	}
.body-bg {
	background: #f3f3f3 url("../images/body_up.gif") no-repeat center top;
}

With this adjust to suit

body {
	margin: 10em 0em 10em 0em;
        background:  url("../images/body_up.gif") no-repeat center top;
        background-position: fixed;
	font-family: arial, helvetica, sans-serif;
	font-size: 0.72em;
	color: #333333;
	line-height: 17px;
	}

[hardwiredtemplates]

Try fixing the background and adding a margin to the body

I also do not see where you have a class defined for .body-bg
See highlighted

body {
	margin: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 0.72em;
	color: #333333;
	line-height: 17px;
	}
.body-bg {
	background: #f3f3f3 url("../images/body_up.gif") no-repeat center top;
}

With this adjust to suit

body {
	margin: 10em 0em 10em 0em;
        background:  url("../images/body_up.gif") no-repeat center top;
        background-position: fixed;
	font-family: arial, helvetica, sans-serif;
	font-size: 0.72em;
	color: #333333;
	line-height: 17px;
	}

Thank you so much chief I've made the change and now the site looks a little strange. I've replace this

body {
margin: 0;
font-family: arial, helvetica, sans-serif;
font-size: 0.72em;
color: #333333;
line-height: 17px;
}
with:
body {
margin: 10em 0em 10em 0em;
background: url("../images/body_up.gif") no-repeat center top;
background-position: fixed;
font-family: arial, helvetica, sans-serif;
font-size: 0.72em;
color: #333333;
line-height: 17px;
}

So I see that the background image background is what was added to the body tag (Is that right?)

I am not sure what you mean by:

I also do not see where you have a class defined for .body-bg
See highlighted

I have not made any changes to the style sheet yet. This is my first change ever.

What I tried to do to fix this (white corners) is add
margin: -10em 0em 10em 0em; in the .body-bg { (not sure if it's called class or tag) so that I can then pull it up by same amount but everything shifts back up and goes back to original.

I wrote a lot I hope I am being clear.

[kobra]

I had not checked your images....

I think this is what you are after maybe - See it HERE

[hardwiredtemplates]

I had not checked your images....

I think this is what you are after maybe - See it HERE

Thanks Kobra that is what I am after... Sorry I had to leave earlier

[kobra]

PM me your email address and I will send you the image and css alteration

[hardwiredtemplates]

PM me your email address and I will send you the image and css alteration

Hello once again, just fulfilled the above.