Topic: Detecting Browser Size and Including a New CSS Sheet (Page 1 of 1)

HELLO! Okay, so my style sheet is included through my header.inc... okay? I have made three style sheets, one for my resolution, which is the original (1280 x 1024), one for 800 x 600 and one for 1024 x 768. I have been googling since yesterday and I have even searched on here (I'm certain I saw something about it when I was searching on Wednesday, but I can't find it again) but I cannot seem to find an appropriate working code for detecting a browser size and linking to the appropriate external style sheet. Any of you intellectuals have the answer hidden under your seat?

Also, is it possible to have a linkable image in CSS? I have my page title as a div background but it didn't occur to me until afterwards that I didn't know how to make a link out of it. Maybe even make the whole div a link?

And if you get REALLY bored, I still have trouble with my CSS menu two threads down (at the time of posting this)

http://despondent.org/ver_1 <---- in case you need to scout around my code, but it is in PHP so... let me know if you need me to rename it for you?
http://despondent.org/ver_1/layout <----- all my tidbits

-
- -
- - -
- -
-

The truth is just an excuse for a lack of imagination. -

Elim Garak, Star Trek : Deep Space Nine

1) you'll need javascript to detect the browser size.
-- however, browser size and screen resolution are two vastly different things.

2) PLEASE do not go down this route. A site should be designed to work regardless the screen resolution of the viewer. Setting different stylesheets based on window size is an obsolete and erroneous approach to web design, IMHO

3) you cannot have a background image itself be a link - it is purely a decoration attached to an element. What you *can* do is wrap the div that holds that background image in an <a> tag, or more appropriately use an <h1> tag for the header (a header tag for a header...) and an <a> tag inside.

Ahhhhh, I didn't even think of linking the div outside of the stylesheet, thanks Yes, I am very bad at the whole "one size fits all" thing. My past approach was that it was my website technically for me only, so if people didn't have my resolution, blast them! Now I want to accommodate the popular resolutions and so far the easiest way I can come up with is a stylesheet (which isn't actually all that easy given how many images my site has via my photoalbums.

I guess I keep expecting some easy solution to fall out of the sky where I can make my website look how I want AND it will cater to those with different browser styles...

-
- -
- - -
- -
-

The truth is just an excuse for a lack of imagination. -

Elim Garak, Star Trek : Deep Space Nine

(Edited by Victoria Draken on 04-09-2007 06:21)

CSS3 Media Queries are exactly meant to provide a mean to filter some CSS to specific aspects of the media used by the user agent. And they a fracking easy to use.

It's a shame that although the spec. has been in Candidate Recommendation state for ~5 years now and only Opera* cared to implement them.



*: well, that might be because Opera is the only really multi platform browser and its core/layout engine is the same everywhere. Therefore CSS3 Media Queries makes perfect sense to them/us.