I've been trying to get browser specific stylesheets without having to resort to server side code and, thanks to an IE feature, this was actually possible. Check out my article on The Picometric on rendering IE-specific HTML/CSS:
http://tinyurl.com/css-for-ie
Showing posts with label css. Show all posts
Showing posts with label css. Show all posts
Monday, March 30, 2009
Saturday, January 17, 2009
CSS Generic Fonts
When specifying fonts through CSS using the "font-family" attribute, you might have users who can't display some of the text correctly when they don't have the font you are using. Sure, you can provide multiple fonts with a comma separated list, but does it have to be so hard?
CSS provides 5 generic fonts that you can provide at the end of the CSS list so you don't have to list every font in existence just to get your page to display in a particular way. The 5 generic fonts are: cursive, fantasy, monospace, sans-serif, and serif.
CSS provides 5 generic fonts that you can provide at the end of the CSS list so you don't have to list every font in existence just to get your page to display in a particular way. The 5 generic fonts are: cursive, fantasy, monospace, sans-serif, and serif.
Monday, December 1, 2008
Web Content Accessibility Guidelines (WCAG)
The World Wide Web was built with the objective of delivering content to all users, across heterogeneous systems and platforms. The idea worked for the most part, but we still have issues with the way browsers work - some sites require the use of a specific browser and, at times, developers create different versions of the pages for different web browsers. To help remedy the situation, the World Wide Web Consortium (W3C) came up with the Web Content Accessibility Guidelines (WCAG).
The WCAG 1.0 standard was published in May 1999. A draft version of WCAG 2.0 was created in January 2001, and the proposed version was formed in November 2008. WCAG 2.0 is expected to be published as a standard on 3rd December, 2008.
You can access the proposed WCAG 2.0 here. Also useful is the CSS techniques for the proposed WCAG 2.0 here.
The WCAG 1.0 standard was published in May 1999. A draft version of WCAG 2.0 was created in January 2001, and the proposed version was formed in November 2008. WCAG 2.0 is expected to be published as a standard on 3rd December, 2008.
You can access the proposed WCAG 2.0 here. Also useful is the CSS techniques for the proposed WCAG 2.0 here.
Monday, June 30, 2008
border-radius not coming to MS IE anytime soon
According to the CSS Compatibility report for Microsoft Internet Explorer browser version 5 to 8 published here, Microsoft doesn't intend to support the border-radius attribute of CSS 3 anytime soon - both Internet Explorer 8 Beta 1 and Internet Explorer 8 RTM will not have support for the property that can save us all from having to download tiny images of curves (not *that* kind of curves!) to created rounded borders.
Firefox supports the border radius, although it needs the "-moz-" prefix.
Firefox supports the border radius, although it needs the "-moz-" prefix.
Thursday, June 26, 2008
Rounded corners in CSS3
Getting rounded corners in CSS3 would be as simple as setting the border-radius attribute.
Mozilla Firefox and WebKit-based browsers support the border radius, although with a non-standard attribute names: -moz-border-radius and -webkit-border-radius (yes, with the leading hyphen)
I've tried it on Firefox 3 and find the anti-aliasing to be a bit too fuzzy. Internet Explorer 7 doesn't support it yet though. Opera 9.5 doesn't seem to support it either.
There are a lot of other cool effects provided by CSS3, such as the nth child pseudoclass that allows you to, for example, provide styles for alternating rows in a list. The CSS looks a little like this:
It makes me wonder... if they had a 2n and a 3n, which would be applied on the 6th element? :-P I guess that would be browser specific behavior.
Mozilla Firefox and WebKit-based browsers support the border radius, although with a non-standard attribute names: -moz-border-radius and -webkit-border-radius (yes, with the leading hyphen)
I've tried it on Firefox 3 and find the anti-aliasing to be a bit too fuzzy. Internet Explorer 7 doesn't support it yet though. Opera 9.5 doesn't seem to support it either.
There are a lot of other cool effects provided by CSS3, such as the nth child pseudoclass that allows you to, for example, provide styles for alternating rows in a list. The CSS looks a little like this:
li:nth-child(2n) { background-color: #6f6; }
li:nth-child(2n):hover { background-color: #090; }
It makes me wonder... if they had a 2n and a 3n, which would be applied on the 6th element? :-P I guess that would be browser specific behavior.
Subscribe to:
Posts (Atom)