Any CSS junkies out there?

[JohnRobHolmes]

Im learning CSS, and want to add a repeating background behind my header. My question is this, do I add the BG command in the head.tpl file or the CSS file? Does it even matter? All of my efforts are causing my site to stop working so far, but im gonna get this.

[Soya]

I thought you meant Counterstrike Source, but then your question confused me:-P

[Kamikaze]

Pm cotharus, he helped me with code before.

[scuzzy51]

i thought he was talking about counter strike too!!

[SlinkySam]

Hey John,
Your best location will be up to how you want to manage it. For one stop shopping, I try to put everything in the CSS file. So within the CSS file I might have a this:

td.bgheader {
background-image: url(../images/bgheader.gif)
}

And then in your header template location you would have this:
[HTML]

[Mr_Freeze]

I just took a look at your sites code.

To keep it really simple you could add this to your css file:

body {
background: url("your image path and name here") repeat-x;
}

This would work if you have an image less than 150px high and want it to repeat(fill) right across the top or your site. There isn't an image already specified for your body tag so this would be an easy fix. Only have to edit one file. The style sheet.

[JohnRobHolmes]

Originally Posted by Mr_Freeze

I just took a look at your sites code.

To keep it really simple you could add this to your css file:

body {
background: url("your image path and name here") repeat-x;
}

This would work if you have an image less than 150px high and want it to repeat(fill) right across the top or your site. There isn't an image already specified for your body tag so this would be an easy fix. Only have to edit one file. The style sheet.

Wouldnt this be breaking the CSS format of my site by forcing the background on all < body > on my site instead of inserting the style on the CSS and only calling it up in the parts of my website that I wanted? I'm not sure what is going on still though. No matter how I modify my CSS and templates I cant call up anything. I know it isn't a cache issue either, as other changes are being updated.

[Mr_Freeze]

Hmmm... not sure what you mean by breaking the css format.

All html pages have a head and body tag. The content that is generally contained within the body tag. What I suggested doesn't require editing anything other than the stylesheet as all pages already have the body tag.

You are correct in that this would add the repeating background on all pages that use the style sheet. But... the background would not fill the whole page as you'll note I added "repeat-x". This will cause the image to repeat on the x-axis only which means one row/repeat across the screen. I did not specify "top left" or "0 0" as that is the default position anyways.

Did you want it on one page only or were you just concerned that it would fill your whole page?

[JohnRobHolmes]

Instead of creating a class and calling it from my header template, I would just be inserting html into my CSS file right?

I tried adding that to my Body and it didn't work. My guess is that something else is overriding it.

[Mr_Freeze]

Hi John,

I just checked your site again.

If you put the line of code I noted before in this file:
http://holmeshobbies.com/skin1/skin1.css
It will show up for you. "Body" will not be a new class, just adding an additional style to an existing html tag. Easy-peasy.

The only thing you will have to edit is path to your image. You can pm me if you like and I can go into more details this eve if you need more help.

[JohnRobHolmes]

Ok, did that and my background color went away. If I change the style to background-image:etc the image disappears.


I want to keep my background color, and still have the image. What am I missing?

[mrpink]

Originally Posted by Soya

I thought you meant Counterstrike Source, but then your question confused me:-P

CS:S.

[BrandonW]

this is a site you HAVE to check out:

http://www.w3schools.com/

[JohnRobHolmes]

I have been reading that site for a few days now. Still dont quite get it, even though I know html. It is probably because I am tired when I read it.

[Mr_Freeze]

Hmmm... a little bit of mixed up code you have there. Try this:

This kills all birds with the same stone.

body {
background: #cccccc url("your image path and name here") repeat-x;
}

I have added the "#cccccc" which is the color specification for the body tag. This is the color that will fill the body of your site. Basically the whole page. Assuming that your background color was #cccccc. You can just swap in the original color. Could have been #aaaaaa or #666666. Can't remember right now...

[JohnRobHolmes]

ah ha! That worked. Now I just gotta learn how to add new classes and call them up, in case I want different backgrounds for different parts of the site or something.

[SlinkySam]

Originally Posted by johnrobholmes

ah ha! That worked. Now I just gotta learn how to add new classes and call them up, in case I want different backgrounds for different parts of the site or something.

Just do what I posted earlier and that gives you the freedom of different backgrounds wherever you want.

-Sam