Header image behind my logo?

Hi everyone

This will be a dumbarse question I am sure, but please be nice to me!

I have been trying for hours to get my logo on my site, and I have somewhat succeeded, however there is still an image behind it. Is there anyway I can put a border around it or add a bar or something to seperate it from the rest of the page?

See here: https://www.maternit-ewest.com.au/store

Also, can anyone tell me how to change the font that "New Products for June" and "New Products" (sidebox) so that they are the same as the other side box headings?

Shoot I have just realised that there is also an error with the headers when I click on the product category 'Must Haves'... could this be my logo causing a problem?

Thanks so much!

Alana

Problem solvered :D

Please expand on how you solved the problem as it might help someone else in the future.

Oops sorry Kim, forgive me.

Well what I did was create in Paint Shop Pro a transparent image that was the same size as includes/templates/my_template/images/header_bg.jpg, saved this image with the same name, and then uploaded it and overwrote the existing image. The problem I think was that my logo was smaller than header_bg.

I am not saying this is technically correct or anything, but it worked so I'm happy.

The sidebox headings I changed in the same way, created paint shop pro images the same size as includes/templates/my_template/images/sidebox_top.gif in the colour I wanted and overwrote the existing ones.

As for the error when I clicked on the category 'Must Haves', I think it must have been the quotation marks causing the problem as the other categories don't have the same error. I am off to remove the quotes and try right now....

Big thanks to everyone who looked at this thread for me :thumbsup:

Hi wowzah

Firstly, well done on finding your own solution. It's good to see new users "having a go".

If you face this problem in future you may find it easier to go to your stylesheet where, for example, you will find> #logoWrapper {

width:770px;
height:110px;
background-image:url(../images/header_bg.jpg);
background-repeat:no-repeat;

}and remove the references top the background image that I have marked in red.

kuroi:

Hi wowzah

Firstly, well done on finding your own solution. It's good to see new users "having a go".

If you face this problem in future you may find it easier to go to your stylesheet where, for example, you will findand remove the references top the background image that I have marked in red.
Can you tell me where i can find this find to add/edit this?
THanks

kimsonvu:

Can you tell me where i can find this find to add/edit this?Your stylesheet(s) should be in a directory called includes/templates/YOUR_TEMPLATE_NAME/css. But what they are called and how many of them you have will depend on what template you are using. However, most templates will have something similar to the styles I marked in red above.

If you post a link to your site, we would be able to tell you exactly what you are looking for and where.

kuroi:

Your stylesheet(s) should be in a directory called includes/templates/YOUR_TEMPLATE_NAME/css. But what they are called and how many of them you have will depend on what template you are using. However, most templates will have something similar to the styles I marked in red above.

If you post a link to your site, we would be able to tell you exactly what you are looking for and where.

This is my site:
https://www.kimson-handicraft.com

I think i use template DF.I see this when i open stylesheet file:

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}

Is that right for edit logo width ?

Thanks

kimsonvu:

I think i use template DF.You're actually using the classic template and so the styles you need are in your includes/templates/classic/css/stylesheet_original.css file. Specifically:> TABLE.header {
background-image: url(../images/header_bg.jpg);
background-repeat: repeat-x;
background-color: #ffffff;
border-right: 1px solid #9a9a9a;
border-left: 1px solid #9a9a9a;
border-bottom: 1px solid #9a9a9a;
}However, given that you are at a very early stage of developing your site, I would recommend switching to a template_default-based template to save you grief later.

kuroi:

You're actually using the classic template and so the styles you need are in your includes/templates/classic/css/stylesheet_original.css file. Specifically:However, given that you are at a very early stage of developing your site, I would recommend switching to a template_default-based template to save you grief later.

Okie i see that,can i add this to that file?

#logoWrapper {
width:770px;
height:110px;
background-image:url(../images/header_bg.jpg);
background-repeat:no-repeat;
}

and remove TABLE.Header ?

I have a header_bg.jpg ,it's include my logo.I just try to add header_bg or logo and i don't want to see 2 pic at a time. :wacko:

Thanks for your help

Funny, I had commented out the two lines in the stylesheet which referred to the header_bg, but IE was still showing it, even though all was kosher in FF.

Even stranger, view source in IE did not have any reference to header_bg in the file. So it was displaying it, but wasn't part of the source?? It wasn't a cacheing issue either. I had to actually delete the two lines for IE to play nice.

I hate IE. :no:

Steel Rat:

Funny, I had commented out the two lines in the stylesheet which referred to the header_bg, but IE was still showing it, even though all was kosher in FF.

Even stranger, view source in IE did not have any reference to header_bg in the file. So it was displaying it, but wasn't part of the source?? It wasn't a cacheing issue either. I had to actually delete the two lines for IE to play nice.

I hate IE. :no:
View source wouldn't show any reference to the header_bg as it is in an external stylesheet not the source.

The usual reason for the other symptoms that you described is using the wrong type of comment for a stylesheet, i.e. using either a php or HTML comment. FF tends to be very nice about this and play along anyway, but IE treats it as an error and ignores your attempts to make it a comment.

Hmm, if the image is being displayed how can it not be part of the source?

I used // as a single line comment, like a java comment, since CSS seems to use that notation, such as /* */ for multi-line.

I can still hate IE :happy:

Steel Rat:

Hmm, if the image is being displayed how can it not be part of the source?

I used // as a single line comment, like a java comment, since CSS seems to use that notation, such as /* */ for multi-line.

I can still hate IE :happy:

But now that I look at it, I can see that happening.

So what is the proper single-line comment for CSS?

Steel Rat:

But now that I look at it, I can see that happening.

So what is the proper single-line comment for CSS?It's /* comment */

Steel Rat:

Hmm, if the image is being displayed how can it not be part of the source?The image is part of the styling applied to the source. This separation of source (aka content) from styling (aka presentation) lies at the heart of current best practise in web design.

kuroi:

The image is part of the styling applied to the source. This separation of source (aka content) from styling (aka presentation) lies at the heart of current best practise in web design.

Gotcha. Makes sense, but it does make things a bit harder to troubleshoot. for me, anyway.

I'm still a Tables man. Can't stand the flightiness of Divs, and how they often fail to constrain content much of the time.

I'm still a Tables man. Can't stand the flightiness of Divs, and how they often fail to constrain content much of the time.

Aw... but, you do not have to give up the tables totally. Only use them where absolutely neccessary. Use the CSS backgrounds with the table(s) for fabulous effects. (that is how the rounded corner frames are done on this site)

Kim:

Aw... but, you do not have to give up the tables totally. Only use them where absolutely neccessary. Use the CSS backgrounds with the table(s) for fabulous effects. (that is how the rounded corner frames are done on this site)

I'm still figuring that out, lol. I did add a bg to the centercolumn on my site via CSS (just a png created in Fireworks. So I know the concept.) It would be nice, however, if IE would join the 21st century and retain transparency on PNGs. Don't know if IE7 does or not.

Steel Rat:

It would be nice, however, if IE would join the 21st century and retain transparency on PNGs. Don't know if IE7 does or not.IE7 does. You're going to have to hate it a little less now :P