CSS Revolution - Use Condition Rules WITHIN Styles

August 13, 2008 in css

Undoubtedly you will have found many a situation where different web-browsers require different style statements. Conditional-CSS addresses this by letting you add Internet Explorer style conditions inline with your CSS statements.

Condition example

Why using it?

Conditional-CSS allows you to write maintainable CSS with conditional logic to target specific CSS statements at both individual browsers and groups of browsers.

Target CSS to any web-browser
Streamline maintenance of your CSS files
Optimise your CSS
Work around those annoying little CSS bugs
Automatic expansion and inclusion of @import statements
It’s free and open source!

Basic usage

The main use of Conditional-CSS is to be able to indicate if a particular CSS statement should be sent to a particular browser or not. Of course you won’t wish to do this often, but it is exceptionally useful when you do need to target a browser.

Any CSS statement or block can be prefixed by a conditional statement, of which there are three basic types:

[if {!} browser]
[if {!} browser version]
[if {!} condition browser version]

To get started with Conditional-CSS use the compiler to download a version suitable for your server platform, and read the usage guide, or see a demo in your own browser (original CSS).

a.button_active, a.button_unactive { display: inline-block; [if lte Gecko 1.8] display: -moz-inline-stack; [if lte Konq 3.1] float: left; height: 30px; [if IE 5.0] margin-top: -1px; text-decoration: none; outline: none; [if IE] text-decoration: expression(hideFocus=’true’); }

Requirements: PHP or C or C#
Demo: http://www.conditional-css.com/demo/
Download: http://www.conditional-css.com/download
Link: http://www.conditional-css.com/

Spread the words

Digg Del.icio.us Stumble Facebook Float Technorati Bump

Whatever you want to say!

Or search by time

Subscribe to Knowtebook

LovedKnowtes

-->

Recommendation

Community Links

70 Impressive Painting Artworks - Winter Inspiration
Where do mixed media artists find inspiration in the winter? We have hand-picked an incredible amount of amazing painting artworks from deviantart to inspire any artist
Six Thinking Hats
Applying the Six Thinking Hats method can greatly improve our web design process.
3 Methods To Exclude Wordpress Categories In A Post
Although there are a lot of methods to exclude categories on your articles or sidebar. But i am going to show you 3 methods which commonly use by people.
Marta Dahlig - digital painter
Marta Dahlig is one of the most known deviants on deviantart.com with nearly 4 milion views on her profile and who knows how many on all her deviations. She is known for her 7 deadly sins drawings of women.
Web Designs with Coffee Aroma
The stimulating collection of Top Coffee Brands websites!
Bible Design
Illuminated Manuscripts to Postmodern Power Plays
45 Vintage 'Space Age' Illustrations
An inspiring collection of 45 vintage illustrations of a space age tomorrow!
8 Wrinkled Paper Textures | Texturise
8 assorted wrinkled paper textures scanned at 300 DPI.
Red themed CSS and Flash design gallery - Part 1
I’ve decided to make the web design showcase themed as it is more easy to find what you are looking for. You will be surprised but there aren’t many quality red CSS and Flash sites. But don’t worry. I’ve gathered in this showcase article 22 of the best, and 23 more are waiting for the release of Part 2 so they can show off their red design.
Typography resources for all things typographic
Here are a few resources I have bookmarked along the way that relate to inspirational galleries, fonts, tips and other type resources.
10 Blender 3D tutorials worth a look
Blender is the free open source 3D content creation suite, available for all major operating systems under the GNU General Public License. I have always wanted to learn a 3d program to extend my capabilities and a little 3D in our designs can take your designs to another level. There is no harm in learning something new so I will list a few good tutorials that I will use to learn my way through blender.
web 2.0 templatesWeb 2.0 templates with simplicity, cleanliness, and elegance in design and the less number of columns and work great for all your needs and have all the great features of Web 2.0 technology.

Subscribe to RSS | Submit a Link

Knowty Links

UserTalk

Friends

CSS Revolution - Use Condition Rules WITHIN Styles

Condition example

Why using it?