Post by matthew_k » Wed Jun 03, 2009 5:57 am

First time trying opencart, and I'm definitely liking it, thanks so much.
I'm seeing what I can do to tweak the stock template and have run into a couple problems. For the background, I am using a gradient that fades from white to black, and I have the background color set to black, so that once the gradient reaches black the rest of the page will be as well. The problem is, I want the gradient to start after the header, and I want the header background to be white, so there is a buffer of white, then the gradient fade to black. I can set the background of the header to white, but the header is in the container, so it only goes out to the 960px, so the black background is showing through in the corners. Do you think it would be possible to accomplish what I'm after?
Also, as you can see the corners on the modules are not showing the background. It is fine on the center box, but I can't seem to nail down what the difference is, as to why it won't work on the modules. Any help would be greatly appreciated.
Here is the site, for reference: http://ccsa.knerrdesigns.com/cart/
Thanks again.
Matthew

Newbie

Posts

Joined
Wed Jun 03, 2009 5:06 am

Post by Calimo » Wed Jun 03, 2009 8:46 am

The header-Backgrounds of the boxes dosnt have transparent edges ...
you schould make them transparent (photoshop?!)

Or u try the images in the Attachment...
put them in this Folder: "http://ccsa.knerrdesigns.com/cart/catal ... ult/image/"


Background-Problem: If i have understood the Problem right, you should change the background-color of the Body to white (#ffffff).

Code: Select all

body (line 9)
{
background-color: #000000; <-------- [b]this should be white (#ffffff)[/b]
background-image: url(../image/body-background_w-b.png);
background-repeat: repeat-x;
background-attachment: scroll;
background-position: 0px 97px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
text-align: center;
}

Attachments

box_bottom.png

box_bottom.png (178 Bytes) Viewed 2346 times

box_top.png

box_top.png (389 Bytes) Viewed 2346 times


My Shop: Centro Benessere by Intègrèe


New member

Posts

Joined
Wed May 20, 2009 4:16 pm
Location - Italy, Chieti

Post by matthew_k » Wed Jun 03, 2009 10:30 am

Thanks so much for the reply, and for the attachments. I don't know if I ever would have thought of that, especially since the other image was working correctly, I thought it must be in the code somewhere.

Regarding the background, changing it to white does give the effect I want at the top of the page, but on the bottom of the page I want it to be black, so that once the background image fades to black the rest of the page will be black as well. I changed the background to white so you can see how it cuts off after the background image (if you haven't seen it already with Firebug, or something). Anyway, it seems I need the header to be 100% and have its background be white, but since the header is in the container, it can't go past 960px. If it could be moved somehow outside of the container, that might work, but I have no idea how to do that, and it may not be worth it if it's too complicated. Doing that would also screw up the placement of the elements in the header.
Reference:
http://ccsa.knerrdesigns.com/cart/
Thanks for any input anyone may have, and thanks again, Calimo for your help.
Matthew

Newbie

Posts

Joined
Wed Jun 03, 2009 5:06 am

Post by Calimo » Wed Jun 03, 2009 2:54 pm

its not a bug ...
You dont want to have the withe bar in the bottom of the Site ??

If you want it like this ??
http://shop.intercede.it/openstore/

then Insert this to body (css):
background: #000 url(../image/bg_grad.png) repeat-x;

and put the attachment in the image-folder of your style!

Attachments

bg_grad.png

bg_grad.png (892 Bytes) Viewed 2334 times


My Shop: Centro Benessere by Intègrèe


New member

Posts

Joined
Wed May 20, 2009 4:16 pm
Location - Italy, Chieti

Post by Calimo » Wed Jun 03, 2009 7:34 pm

And delete the "background-position: 0px 97px;"

My Shop: Centro Benessere by Intègrèe


New member

Posts

Joined
Wed May 20, 2009 4:16 pm
Location - Italy, Chieti

Post by matthew_k » Wed Jun 03, 2009 9:38 pm

Thanks again. So simple, but again, I was on a train going the wrong direction! I feel dumb though. Thanks for the fresh eyes.

I didn't mean to suggest this was a bug; Firebug (http://www.getfirebug.com/) is a Firefox plugin I use to look at and test different css changes without editing the actual css file, and thought maybe you were using a similar utility.

Thanks,
Matthew

Newbie

Posts

Joined
Wed Jun 03, 2009 5:06 am

Post by Calimo » Thu Jun 04, 2009 4:28 am

i use CSS Edit ...
looks nice with the blue background .... better then the black one ...

My Shop: Centro Benessere by Intègrèe


New member

Posts

Joined
Wed May 20, 2009 4:16 pm
Location - Italy, Chieti

Post by phpuk » Thu Jun 04, 2009 5:31 am

I agree.

It looks nice with the blue background.

Global Moderator

Posts

Joined
Wed Mar 25, 2009 10:57 am
Who is online

Users browsing this forum: No registered users and 12 guests