Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

CSS Background problem!

Status
Not open for further replies.

lexus

MIS
Oct 1, 1998
277
0
0
I am setting up some files for a Dreamweaver CSS class that I am teaching and I am driving myself crazy with the following problem. I hope I can explain this clearly!

I have a file called xyz.html in the 'root' of the web. I want to attach a style sheet to it that I have in the /styles folder called yellow.css

I want to assign the background graphic in this style sheet. Sounds simple. The graphic is in the /images folder.

So, here is the basic structure (folders and files)of the web:
'root'
/images
/styles
index.html
education.html
etc......

Dreamweaver puts in the code on the style sheet as:

body {
background-image: url(../images/background.gif);
background-color: #FFFF99;
}

This works fine for previewing in IE 6 but shows no background in Netscape 4.79 (yes, it only shows me the bacground color). All the other codes on the style sheet are called into the xyz.html file just perfectly.

If I change it to:
body {
background-image: url(images/background.gif);
background-color: #FFFF99;
}
It works fine in Netscape but not in IE.

As a last resort, I have even tried putting both statments in and I get nothing. I have been working on this file for 2 days now and I need to get it figured out if I am to teach this.

Any help would gratefully be appreciated!

Thanks,
Lexus **Quiquid latine dictum sit altum viditur.**
 
update to the most current NN and it will work [soapbox]
sleep is good
 
I can't upgrade Netscape as this would involve updating 25 computers! It is for a class I am teaching in CSS in a few months. Since most of our clients are still using 4.79, it would not be helpful to them when they left (if it worked here and not at their place).

If this isn't possible in 4.79, I need to know that so I can do a work-around and explain to them why.

If I create a folder and move the file into that folder, it works fine in Netscape 4.79 as well as IE.

**Quiquid latine dictum sit altum viditur.**
 
Try ..images/background.gif [soapbox]
sleep is good
 
Thanks, deecee, but that didn't work either.

I really need help with this and can't figure it out. Any suggestions where to look for other help? I am going to cross-post it to the DW MX forum here as well. **Quiquid latine dictum sit altum viditur.**
 
Your problem might be the version of CSS you are using also you may mahe to load it in the body rather than the stye sheet. <body bground=&quot;images/background.gif></body>.

Hope this help.

Rudy
 
like I said you have to update to the most current browsers for it to work. Like Rudy said try putting all the styles in the pages. I think it has something to do with the external style sheet and the older NN browser. Its much more compatible now with the new Nutscrap and IE.
[soapbox]
sleep is good
 
Thanks for all the suggestions. Unfortunately, I can't update the software in all the labs as we need older versions of the browsers for some other programs to work. And I train teachers and staff in schools and they can't update their stuff either for other reasons! Would you believe that we still have some schools here in New York State on Win 3.11 cuz they refuse to give up ICLass?????

Anyway, it will work if I put the education.html in another folder. Second workaround is: it works if I hardcode the file for the absolute path. Rudy's solution is just plain old html and this is a class on using external style sheets (not embedded on inline). BTW, it's CSS 1 not 2 that I am teaching in this course.

The folks taking this class better know how to tag in Hhtml since they are students from previous classes of mine. This should be the 7th class in the series that they are taking with me. All previous ones are required as well!!!

Again, thanks for all the help. Guess I will just have to explain (AGAIN) to make sure they test in all browsers possible and make adjustments accordingly. **Quiquid latine dictum sit altum viditur.**
 
I would first put background-color then background image...

body {
background-color: #FF9;
background-image: url(images/background.gif);
} Good Luck! :)
 
Thanks...didn't make a dif though :( **Quiquid latine dictum sit altum viditur.**
 
well, as I understand you've got separated CSS file which you include into HTML pages. if so, you should (at least I would for sure) use site root related image path (/images/), not document related (images/ or ../images). Why? because you call this image from pages from different folders. Clear?

body {
background-color: #FF9;
background-image: url(/images/background.gif);
}

Works or not? Good Luck! :)
 
Eugene:
I havew tried every combination for the path that is possible: ../images and /images and just images/

Nothing works for netscape 4.79...only the absolute path...What a PITA this has turned into! **Quiquid latine dictum sit altum viditur.**
 
One more thing you may try: I noticed that NN doesn't properly display background image if its smaller than about 40x40px. Try creating some test image with dimensions lets say 100x100px and try it.

say if it doesn't work, there must be a solution! Good Luck! :)
 
weel nsn 4.6+ <6.0 doesn't render CSS correctly to begin with. Trying to code for a browser that never followed W3c standards will do you no good. You'd be teaching the wrong way if you try to teach for a browser that isn't even W3c compliant.

My rules for browser integration:

NS N 4.6+ < 6.0 no use of CSS
IE5.0 and NSN 6.0+ = use CSS.

I make two versions of the site, and use a script to direct visitors to the correct one via what browser they are using.

And what od you mean other programs wont work if you try to upgrade? last I looked, nothing was dependent on NS in the first place. My comuter runs fine without any ns products on it.

upgrade to compliant browser. Its easier than trying to code for a broken one.
 
Dear WizyWyg:

I cannot upgrade as this is a corporate learning situation with several labs and many, many PC's. We DO have a few web-based programs that other departments here use that will not run on Netscape 6 or higher.

If you read in my previous posting, I also train school district personnel that also cannot upgrade from 4.79. It's not my choice but, when you are in a corporate and governemental training situation, you work with what the majority of your clients have.

I thank you for you help though. The re-direct script certainly would be an option but this is a 5 hour class I am teaching as an Introduction to CSS. It is the 6th in a series of 5-hour classes that I offer in HTML, Dreamweaver, and Accessibility.

Yes, I must also teach them how to create accessible sites since we are bound by state and federal guidelines for that in our occupations. ( and all that jazz)

Such fun..... **Quiquid latine dictum sit altum viditur.**
 
Hey Lexus, you didn't say if you tried or not creating a background image with bigger dimensions. Good Luck! :)
 
Yes, Eugene...didn't work...must be a problem with Netscape 4.79 I guess...Seems I will have to tell the clients in the class to use the absolute URL to be safe...

Thanks for the suggestion though...All are welcome! **Quiquid latine dictum sit altum viditur.**
 
selector {background: [color] [image] [repeat] [attachment] [position];}

If you look at the CSS declaration above, you will see all the properties for background are declared one after the other without , or ; just use a space to seperate. This is what NS4.x understands in comparision to this

selector {
[background-color];
[background-image];
}
which is understood by the latest browsers Ranjan
- A Dreamweaver Community
Join today for your answers in web design
 
There is a full discussion on Netscape 4 issues on this site - and some work-arounds. There is also a page with helpful links - can't remember which one but somewhere there was a chart detailing what's usable for which browser.

Since Dreamweaver comes with TopStyle Lite, you should be able to use that program to check whether or not the command you want is available for the browser you are using.
(Your students might find it easier to use too).

Hope that helps.
 
Thanks, Jill. That loks like an interesting site and one I shall pass on to my students! I didn't see TopStyle Lite in MX or 4 but will look for it. I remember downloading it in class I took on CSS a while ago but they didn't mention that it came with Dreamweaver. Where do I access it in MX? **Quiquid latine dictum sit altum viditur.**
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top