...

View Full Version : Problems setting background in css...



ptsiii
11-15-2009, 09:38 PM
Beginner in code here, having issues with setting a bkrnd in css.

I think this should be a simple fix...
what am I doing wrong?





@charset "UTF-8";
/* CSS Document */

<style type="text/css">


body
{
background-image:url('BTSbkrnd.jpg');
}

#wrapper #nav {
background-color: #FDDAAC;
text-align: right;
width: 720px;
float: right;
z-index: 1;
}
#wrapper {
width: 800px;
margin-left: auto ;
margin-right: auto ;
}
#wrapper #header {
position: relative;
z-index: 8;
top: 75px;
left: 30px;
width: 320px;
}
#content {
background-color: #FBDBAC;
float: right;
width: 720px;
z-index: 1;
}
#leftbox {
float: left;
width: 230px;
text-align: left;
top: auto;
padding-top: 20px;
z-index: 1;
padding-left: 5px;
}
#copy {
font-family: Tahoma, Geneva, sans-serif;
font-size: 14px;
text-align: left;
float: right;
width: 455px;
font-weight: bold;
color: #210;
padding-right: 15px;
padding-left: 15px;
z-index: 4;
}

</style>

Excavator
11-15-2009, 10:03 PM
Hello ptsiii,
That code should load an image called BTSbkrnd.jpg from the same directory that your css file is in.
Double check your path and filename.


/edit/
From a previous post of yours, the path to that image is actually /images/BTSbkrnd.jpg so you would use
body {
background-image: url(images/BTSbkrnd.jpg);
}

ptsiii
11-15-2009, 10:17 PM
thats what i thought, doesn't seem to be working.

Excavator
11-15-2009, 10:28 PM
Can you put up a link to the test site? I could check the path for you then.

Excavator
11-15-2009, 10:30 PM
In place of knowing where your index and image files are, this might work for you as a temporary fix -
body {
background-image: url(http://bootsandpants.com/bts/images/BTSbkrnd.jpg);
}

ptsiii
11-15-2009, 10:37 PM
i put the new site up on my test site.

www.bootsandpants.com/bts



I must say... this is making me feel like quite an ignoramus... but i guess its better than my last attempt....

Excavator
11-15-2009, 10:55 PM
In bts.css
Delete the lines highlighted in red -
@charset "UTF-8";
/* CSS Document */

<style type="text/css">


body {
background-image: url('images/BTSbkrnd.jpg');
}

#wrapper #nav {
background-color: #FDDAAC;
text-align: right;
width: 720px;
float: right;
z-index: 1;
}
#wrapper {
width: 800px;
margin-left: auto ;
margin-right: auto ;
}
#wrapper #header {
position: relative;
z-index: 8;
top: 75px;
left: 30px;
width: 320px;
}
#content {
background-color: #FBDBAC;
float: right;
width: 720px;
z-index: 1;
}
#leftbox {
float: left;
width: 230px;
text-align: left;
top: auto;
padding-top: 20px;
z-index: 1;
padding-left: 5px;
}
#copy {
font-family: Tahoma, Geneva, sans-serif;
font-size: 14px;
text-align: left;
float: right;
width: 455px;
font-weight: bold;
color: #210;
padding-right: 15px;
padding-left: 15px;
z-index: 4;
}

</style>

You need the style lines for CSS embedded in the head of your document. A linked CSS file like your using should ONLY have CSS in it.

ptsiii
11-15-2009, 10:59 PM
i tried using the code you posted



body {
background-image: url(http://bootsandpants.com/bts/images/BTSbkrnd.jpg);
}


... still doesn't work. Could it have something to do with the fact that its the only style on the style sheet that doesn't pertain to a div?

ptsiii
11-15-2009, 11:01 PM
you're my hero.

worked like a charm.

ptsiii
11-15-2009, 11:03 PM
i read in your signature... what is validation? if it is as important as you say it is... i should probably read up.... have any useful links or suggestions on the matter?

Excavator
11-15-2009, 11:12 PM
i read in your signature... what is validation? if it is as important as you say it is... i should probably read up.... have any useful links or suggestions on the matter?

In my sig, look at the "why validating is good" link.
Did you notice there is a validator for your markup and another for your CSS?
Also the tagline, "use it like a spellchecker" is a good suggestion.

Excavator
11-16-2009, 12:02 AM
I've always liked this explanation - http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum