strange problem with css and modification of tpl_main_page.php

[sartzsche]

url to my store: www.clickpopstore.clickpoprecords.com

i've modified the tpl_main_page.php in my_template directory to override the default template. what i'm trying to accomplish is a change of background, as well as an addition of an image, and an addition of a navigation header [although not technically a "header" within the zen template scheme].

here is the site i'm trying copy: www.clickpoprecords.com

the problem, as you can see, is that i'm getting the background-color covering the entire background [smothering the gradient-background/image/navigation], and nothing else is showing up.

here's the strange part: when i use firefox's web developer toolbar and go to css>edit.css the page suddenly appears fine!

what's going on here? how do i remedy this problem?

[kobra]

I am not much of a coder but looking at your ZenCart Site, the color #153f6e is the predominant color showing. The only place this shows up in your css is in the following code

div#b1 {
    background: #153F6E url(includes/templates/bryancustom/images/clickpop_towers_bg.jpg) fixed bottom repeat-x;
    height: 100%;
    width: 100%;
   margin: 0px;
   padding: 0px;

You might try this or make it transparent
div#b1 {

    background: url(includes/templates/bryancustom/images/clickpop_towers_bg.jpg) fixed bottom repeat-x;
    height: 100%;
    width: 100%;
   margin: 0px;
   padding: 0px;

[sartzsche]

the color #153f6e is the predominant color showing.

thanks for replying. that color serves as a background loading color that matches the top of the bg-image gradiant in div#b2. it is behind div#b2 and should not even be visible after the page is loaded. if you check out www.clickpoprecords.com you will see all of the elements in action, working properly.

the part i can't figure out is how to merge the css/html that i used at www.clickpoprecords.com into the tpl_main_page.php [or elsewhere] and make things load properly in the browser.

[if you have firefox and the developer's toolbar, you should try editing the CSS from the developer's toolbar and see what happens - when you click on the "edit CSS" selector, the page instantly changes to the intended look... only to change back when i close the editor!]

can't figure this out.

[sartzsche]

alright. i figured it out:

in the css - the url must be complete with "http://wwww...."

wow. annoyingly simple.