Newbie - will css accomplish this task...

[cluckeyo]

I have ordered an o'reilly book on css because i think it is what i need. I have a store with a long (1100 pixel) graphic at the top which looks great on my 17" monitor but not so great on my laptop (too much scrolling involved). I want to be able to have different lengths of graphics (and maybe change a table or two) set to pull into various sized monitors. I am assuming this will involve setting some cookies and doing some css. Am i right? Please advise.

[rich_b]

It sounds to me like you are aiming to do some screen resolution detection and then re-direct visitors to a specific page tailored to their resolution. To be honest I wouldn't recommend doing that but if you must then you will need some javascript to do the detection. CSS won't do it alone, but you will be able to use CSS to style each page that the users have been redirected to.

It should be better to redesign the graphics and/or page differently to cope with the two most common resolutions of 800x600 and 1024x768 without resorting to scripting. Your 1100px wide graphic sounds like a background graphic to me - am I correct?

[cluckeyo]

its a banner that is made to match the size of the screen in my ebay store snip
i am having to deal with ebays format and in order to make things attractive i can't think of any better way to do it.

[edited by: SuzyUK at 11:44 am (utc) on Oct. 28, 2004]
[edit reason] link removed by request :) [/edit]

[rich_b]

By the way, you will get told off by a moderator for posting that URL as it's against the TOS of this board so it would be a good idea to remove it. However, I now see what you mean.

I've never used an Ebay shopfront builder so I can't be sure but I don't think you need to make the graphic that wide. Other stores have a fluid layout that copes with multiple resolutions. I would aim to do that.

There is another store which I won't mention by name here but I'll stickymail you. They also have a graphic which runs the width of my screen but it fits nicely and doesn't overrun the edge. What they have actually done is use two images side by side. The left image is shown once and the right image seemlessly blends in to the left image and automatically repeats itself to fill any available horizontal space. If you play around with the horizontal sizing you will see what I mean. You can use CSS to do this.

[cluckeyo]

not sure how to undo my posting. sorry will fix this as soon as i get it figured out.

[rich_b]

In the left-most column under your name you should see a button called 'owner edit'. IIRC, this site has a timeout policy on edits so it may not be there for you now. But I could be wrong.

[MatthewHSE]

I suggest a simple javascript resolution detector that writes a different stylesheet for each resolution. Be sure to provide your 800x600 stylesheet using the standard <link> or @import method above your script call. That way, people with javascript disabled still get your 800x600 stylesheet. This makes it readable for those with higher resolution without breaking it for those who still use 800x600. For those who have js enabled, the script then inserts other stylesheets based on resolution, which will over-ride your "default" stylesheet. This works great for me, although I'm working on some different solutions that might eventually work better.