can you change images on a page through an external css?

[leeolive]

I have a question that has been bugging me for a l-o-n-g time. I am building a site and the client is very picky. They want it to look at certain way with all elements exactly the correct size etc.

I am only concerned with 600, 800 and 1024 screen size widths. I have created a style sheet that detects which screen size the user has and then directs to a specific style sheet ie style600, style800 or style1024. I can alter the font size etc easily enough.

The links are however images and on a 1024 screen they need to be quite a bit bigger than on a 800 screen as do a couple of other images.

The bottom line, my question istrying to be clear about this!)

1. For example, I place images within a table in index.html. I then detect the screen size from this same page. If the screen is 800, I send them to the style800 page. Within the style800, can I specify different images to show up, instead of those on index.html - is this possible and how?

2. Does anyone have a sample or reference style sheet they keep on hand which encompasses the majority of elements ie table widths, heights, row widths/heights, margins etc and also the actual html page where they link in to the style sheet.

3. Is there a problem with using divs? I heard something about macs not supporting them. Which tags are the safest way to go?

Really appreciate the help!
Lee-Ann

 

[xxlargewasp]

Gosh ...
Too many questions

Alright, you can make your own class within each of the style sheets to specify the HEIGHT and the WIDTH for the images. You might write this for example:
--------------------------------------------------
<style type=&quot;text/css&quot;>
.mythumbnail {height:50px; width:50px;}
</style>

<img src=&quot;001.jpg&quot; class=&quot;mythumbnail&quot;>
--------------------------------------------------
Now, you can define the same class in both &quot;style800&quot; and &quot;style1024&quot; and give it different values. In &quot;style800&quot; you might define your class like this: (.mythumbnail {width:50px; height:50px;}) and in &quot;style1024&quot; you might define it like this: (.mythumbnail {width:100px; height:100px;})

I hope this helps .. check this link for more CSS properties

http://www.devguru.com/Technologies/css/quickref/css_index.html

GOOD LUCK ....:::::.... xxLargeWASP ....:::::....