Images won't load in browser using CSS 2

[beeej21]

Hello all!
I am struggling with what seems to be a very simple problem. Well, the issue is extremely annoying and problematic, and I am unable to figure out the solution.

I am using CSS to load an image onto my HTML page. The reason being because I'd like to be able to swap out the images using CSS depending on the circumstance. Well, for some odd reason, the image is showing up in Dreamweaver CS3 in my desighn panel, but it does not show once I load that same page into a browser! That is very frustrating.

Here's the the link to the css file:

http://www.soniyephotography.com/TEST/css/one.css

Here's the link to the javaswitcher js file:

http://www.soniyephotography.com/TEST/css/styleswitcher.js

Here's the link to the testing HTML page:

http://www.soniyephotography.com/TEST/html/test.html

Can someone PLEASE explain to me why Dreamweaver is showing the image in my table cell, but once I load the page into a browser ( IE, Firefox, Netscape, etc ) I do not see anything except for the background color I picked for the css tag? The background color shows up, so I know that the HTML page is connecting properly to the css file.

Please note that on the first style, that is where I'd like the image load. The other two styles don't have images ( yet ). The background color shows up perfectly, but no image. Even if I delete the background color... the image still does not show up. I am working in Dreamweaver CS3.


Please help. Thank you in advance.

Thanks again for your help and consideration.

 

[Vragabond]

You're using [tt]backgrond-attachment: fixed;[/tt], which means your background is fixed on the viewport (browser window) depending on the position you set it. Since you do not position the background (therefore it is at top left corner) and do not repeat the image, the image cannot be seen in the given element (because the image is seen in the top left corner of the browser window and have specific dimensions it does not reach all the way to the div. DW CS3 must have an incorrect rendering engine to show the image in the div.

Simply remove the background attachment property and your image will show up.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

 

[beeej21]

Hi Vragabond...Thank you kindly for taking the time to help me out. I did what you suggested, take out the background-attachment property, but I am still not seeing an image in the browser. I've updated the css file if you'd like to take a look at it again for me. Thanks a million for your help.

 

[beeej21]

Vragabond,.. I may have spoken too early, Friend. After toying around a little here and there in the CSS file, my images are suddenly showing up in my browsers ( well at least in IE and Firefox so far ). I can't put my finger on it, so I am assuming that your advice DID actually work. I may have not refreshed my page or something. Let's hope it continues to work now. Thanks a MILLION for your help.

 

[Stormheart]

Dreamweaver is a good HTML editor on Windows. I also use DW. But its "preview" is only useful to work on it - I mean doing things you better to see, like drawing tables, maps ot formatting text, and after "fine-tune" it by hand in the source.

Unfortunately its rendering cannot be truested since it shows working many things what are not working in browsers.

The best solution is what I did on my notebook: There is a web , PHP and SQL server installed, and the servers wwroot folder is tha folder I store all websites I create. So in this way, I open that folder in browsers (shows up as ftp) and than with a sipmle click I can watch any sites working, even the server side part. So when i work on the code, I just hit Ctrl+S (save) in DW, Ctrl+Tab and F5, and I see what happens.