PDA

Click to See Complete Forum and Search --> : including bg image by css

zerooito
07-24-2003, 02:13 PM
Hi!

Iīm experiencing some troubles
including some css in a html file.

The matter is:

In the css code:

<style>
body
{
background-image: url('images/myImage.jpg');
background-repeat: repeat;
background-attachment: fixed;
}
</style>

but the html doesnīt show the image as background,
like I want.

If I put the same code in the HTML, instead of
including it by the external css, it works.

But I need to use it as a external file.

How may I solve that?

Thanx in advance!

Zerooito
J.C.
07-24-2003, 03:01 PM
Try this instead:

<style>
body
{
background-image: url(images/myImage.jpg);
background-repeat: repeat;
background-attachment: fixed;
}
</style>


no need for ' '
nkaisare
07-24-2003, 06:39 PM
The url for the image is relative to the location of CSS file and not that of the HTML file.

If you have directory structure:
|
|- index.html
|- [style]
| |- mystyle.css
|- [images]
| |- MyImage.jpg

use
background-image: url('../images/myImage.jpg')

The use of single quotes is optional.
zerooito
07-24-2003, 08:40 PM
Hmmm....

right...

thanx for your reply, but...

both the css, and the html are in the same directory.

so, there wouldn't have no need to
change the location for the image
to another directory.

I think the same code would work for both
the HTML or to the CSS file.

but that just work for HTML.

What could it be?

Thanx again!

Zerooito
DaveSW
07-25-2003, 03:57 AM
Very strange:

I've tested this code on my machine and it works:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<style type="text/css">
<!--
body {
background-image: url('tollgate808080.jpg');
background-repeat: repeat;
background-attachment: fixed;
}
-->
</style>
<title>Untitled</title>
</head>
<body>
</body>
</html>


Is there another style applying to the body background within the document? )styles within the document override external ones)
Or could you upload your page somewhere, so we can take a look?

Dave
nkaisare
07-25-2003, 10:47 AM
Run your CSS file through validator http://jigsaw.w3.org/css-validator/

You should not use
<style></style> or
<!-- -->
withing your CSS.
zerooito
07-25-2003, 01:02 PM
I guess itīs a very easy stuff that
I just didnīt realize yet, but...

If you could help me in that, I would appreciate.

file attached

Thanx!
DaveSW
07-25-2003, 02:21 PM
LOL

It took me 10 mins to work this out!

You're not supposed to have the <style> tags in an external style sheet! It goes in without style tags, just the bare code lol

EDIT: I wondered what Niket meant lol.
nkaisare
07-25-2003, 04:08 PM
Originally posted by DaveSW
EDIT: I wondered what Niket meant lol.
Thats exactly what I meant. You shouldn't have <style> or <!-- --> in external CSS file.
zerooito
07-25-2003, 04:42 PM
Oooh my!

So that was what Iīm doing wrong?

Darn it!

hehehehe

thanx, guys!...

I tested and itīs working nice!

Thanx a lot!

Zerooito
DaveSW
07-26-2003, 04:59 AM
Originally posted by nkaisare
Thats exactly what I meant. You shouldn't have <style> or <!-- --> in external CSS file.

I read it and thought you meant nesting style tags inside style tags lol