Problem with css code background.

[Ani_]

HI all,

i was trying to follow the tutorials about the photoshop mockup, and i created the layout but now i got the problem that the wooden background wont appear when i open my index file. Maybe someone can help me.

Here is the html code:

Home


Over


Contact


Extra






Main content.

And here is the css:

/* RESETS & BASIC PAGE SETUP */

* { margin:0; padding: 0; }

html { overflow-y: scroll; }

body {

font: 62.5% "Lucida Grande", sans-serif;

background: url(images/body_bg.jpg) ; }



ul { list-style: none inside; }

p { font-size: 1.2em; line height: 1.2em; margin-bottom: 1.2 em; }

a img {border: none; }

/* END RESET */



/* TOOOLBOX */

.floatleft { float: left; }

.floatright {float: right; }

.clear { clear: both; }

/* END TOOLBOX */

---

well thanks in advance and i hope to hear from someone.

Ani_

[TheDoc]

Do you have a link to the site?

I’m guessing that your path to your image is wrong.

[Ani_]

it isn’t online yet. the images map is located in the root folder so i thought the path was images/body_bg.jpg becouse it is in roots right? still let me re-check and thanks for looking at it! :)

[TheDoc]

It depends on where your CSS file is. If your CSS file is in a folder in the root called CSS then you’d have to back out to the root and then go to the images folder.

url(/images/body_bg.jpg)

The above code will go right to the root, then check for an ‘images’ folder.

url(../images/body_bg.jpg)

The above code will move one folder up from the current position and then check for an ‘images’ folder.

url(‘../../images/body_bg.jpg)

Will go two folders up and check…

You get the idea!

[Ani_]

Yes thats probaly the problem! My style.css file is in the map css. So in order for my css to find the image it will have to get out of the directory css to find it. Will let you know if it worked!

Thanks!

[Ani_]

Yes thats probaly the problem! My style.css file is in the map css. So in order for my css to find the image it will have to get out of the directory css to find it. Will let you know if it worked!

Thanks!

[Ani_]

well i did it how you told me, but i still wont see any background. ill show you the code:

/* RESETS & BASIC PAGE SETUP */

* { margin:0; padding: 0; }

html { overflow-y: scroll; }

body {

font: 62.5% "Lucida Grande", sans-serif;

background: url(../images/body_bg.jpg) ; }



ul { list-style: none inside; }

p { font-size: 1.2em; line height: 1.2em; margin-bottom: 1.2 em; }

a img {border: none; }

/* END RESET */



/* TOOOLBOX */

.floatleft { float: left; }

.floatright {float: right; }

.clear { clear: both; }

/* END TOOLBOX */

as you see i changed the path to go up one folder and then search for the images folder and then for body_bg.jpg but it wont show.

[Watson90]

Hi there Ani,

It seems like you’re doing everything right.

Maybe try:

body {

font: 62.5% "Lucida Grande", sans-serif;

background-image: url(/images/body_bg.jpg);

}

I set the property to background-image rather than background. Just see if that works instead.

Thanks

[Ani_]

hmm i copied the code just like you typed here but my nice wooden background wont appear haha. so i realy dont know what to do now :P

[Ani_]

one way or another i scripted everything from scrap and now it works oleee:P thanks for evrything guys!

[Watson90]

Weirrddd! Haha, glad everything worked out :)

[Author]

Posts