Sent by Michael Wilson on 9 November 2004 02:02
J.R. Pitts wrote:
> Should I be looking at researching compatible CSS hacks to have a single CSS
> file, or should I create multiple CSS'es (or maybe imports), and server-side
> sniff which one to push to the client?
Hacking may or may not be necessary (Opera, IE Mac, and etc.) and that
decision may depend on your layout, design, and desire to have a
specific layout across all of your "target" browsers. If the IE box
model is the only real issue holding you back there are sound
alternative to hacking and browser sniffing. You can create separate
sheets for IE 5.x and serve them using conditional comments that only IE
recognizes.
For example, if you create the following deceleration:
#container {
border: 1px solid #333;
margin: 5px;
padding: 10px;
width: 700px;
}
You could use the simplified box model hack within a single stylesheet
to correct IE v5.0.1 and v5.5's box model issue:
#container {
border: 1px solid #333;
margin: 5px;
padding: 10px;
width: 700px;
\width: 732px;
w\idth: 700px;
}
Alternatively you could use a hack-free method by creating an IE 5.x
stylesheet and serve it to IE using a conditional comment:
Put this in the stylesheet:
#container {
width: 732px;
}
Call it like so (or with the import method is you wish):
<link rel="stylesheet" type="text/css" href="css/primary.css" />
<!--[if IE 5]>
<link rel="stylesheet" type="text/css" href="css/ie-5.css" />
<![endif]-->
You can also use conditional comments within an individual document to
control styles and content:
<!--[if IE 5]>
<style>
#container {
width: 732px;
}
</style>
<![endif]-->
<!--[if IE 5]>
<p>You browser is IE 5.x</p>
<![endif]-->
However, you cannot use conditional comments *inside* a <style> element
or in a separate stylesheet--it's meant to be used only within the (X)HTML.
I prefer to use the conditional comment method when I can because it
keeps all of my IE specific workarounds in easy to find and maintain
documents.
Further reading:
http://css-discuss.incutio.com/?page=CssHack
http://www.virtuelvis.com/archives/158.html
http://www.informit.com/articles/article.asp?p=170511
http://www.dithered.com/css_filters/css_only/index.php
--
Best regards,
M. Wilson
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
