5 CSS3 Design Enhancements That You Can Use Today

Cascading Style Sheets (CSS) is the language of Web design, and the next generation of CSS design properties are just chomping at the bit to be released.

Are you eager to start using them, but don’t know where to start?

Although many of the new properties are not yet “official”, some browsers have already implemented many of the features of the coming CSS Level 3 specifications.

The problem is that many browsers—most notably Internet Explorer—have not.

The trick to using these new CSS3 features is to treat them as design enhancements.

A design enhancement (which I discuss in my new book Speaking In Styles: The Fundamentals of CSS for Web Designers) is any flourish you add to your site designs that increases its visual appeal without diminishing its usability if the style is not rendered.

This can be a tricky call, with there being a fine line between enhancement and not diminishing usability:

  • Design Enhancement Example: Using border-radius to round box corners, creating a more appealing design. However, if the corners are not rendered, the site is still just as usable.
  • Example of Design Diminishing Usability: Using an RGBA color value in the backgrounds of overlapping elements that all need to be visible, expecting the upper elements to be semi-transparent. This will make it impossible for some people to use the site, thereby diminishing the page’s usability.

Let’s take a look at 5 different CSS3 properties that you can start playing with right now, provided that you always keep in mind that they should only be used to enhance your design, and not be relied upon for site usability.

This is the original design, before applying any CSS3 design enhancements

1-original.jpg

 

1. Transparent Colors

Supporting Browsers: Apple Safari 4, Firefox 3.0.5, Google Chrome 1

RGBA allows you to control the opacity of a particular color fill, whether it is for text, background, border, or shadow colors.

Setting the color transparency requires you to specify the color value using RGB notation—hexadecimal values are not allowed—with an additional A value being from 0 (transparent) to 1 (opaque).

rgba(0-255,0-255,0-255,0-1)

You should also include a simple RGB, or hex color value as a fallback for other browsers to use:

.topbox {
color: rgb(235,235,235);
color: rgba(255,255,255,0.75);
background-color: rgb(153,153,153);
background-color: rgba(0,0,0,0.5);
border-color: rgb(235,235,235);
border-color: rgba(255,255,255,0.65);
}

The good news is that there is also a fallback solution—at least for background colors—in Internet Explorer, which supports transparent colors using a filter and conditional styles:


Note: Due to the fact that WordPress could not display the above code in the content of this post, it has been included as an image, therefore you will need to type this code manually.

2-color.jpg

 

 

2. Rounded Corners

Supporting Browsers: Apple Safari 3, Firefox 1, Google Chrome 1

Border radius sets the curvature of each corner of the box, as if there is an imaginary circle on the corner with a specific radius (r):

border-radius: r;

Although border-radius will be a part of the coming CSS3 specification, both the Mozilla Project (Firefox) and Webkit (Safari and Chrome) implemented their own versions which have to be included for maximum cross-browser compatibility:

-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;

You can also set the radius for the corners individually:

CSS3

Mozilla

WebKit

border-top-right-radius

-moz-border-radius-topright

-webkit-border-top-right-radius

border-bottom-right-radius

-moz-border-radius-bottomright

-webkit-border-bottom-right-radius

border-bottom-left-radius

-moz-border-radius-bottomleft

-webkit-border-bottom-left-radius

border-top-left-radius

-moz-border-radius-topleft

-webkit-border-top-left-radius

border-radius

-moz-border-radius

-webkit-border-radius

3-borderradius.jpg

 

 

3. Text Shadows

Supporting Browsers: Apple Safari 3, Firefox 3.0.5, Google Chrome 1

Add a shadow underneath any text, controlling the left/right and up/down offset, as well as the color:

text-shadow: x y blur color;

You can combine the text shadow with a transparent color to control the darkness of the shadow:

text-shadow: -2px 2px 10px rgba(0,0,0,.5);

You can also include multiple text shadows just by repeating the values separated by a comma:

text-shadow:   0 0 10px rgba(0,255,0,.5), -10px 5px 4px rgba(0,0,255,.45), 
15px -4px 3px rgba(255,0,0,.75);

4-textshadow.jpg

 

 

4. Box Shadows

Supporting Browsers: Apple Safari 4, Firefox 3, Google Chrome 1

Adding a drop shadow to any box on the screen follows the same format as adding a text shadow:

box-shadow: x y blur color;

Just like text-shadows, Mozilla and Webkit have implemented their own vocabulary in advance of the final CSS standard:

-webkit-box-shadow: 0 0 10px rgb(0,0,0);
-moz-box-shadow: 0 0 10px rgb(0,0,0);
box-shadow: 0 0 10px rgb(0,0,0);

You can add multiple shadows just by including multiple values separated by spaces:

-webkit-box-shadow: 0 0 20px rgb(0,255,0), -10px 5px 4px rgba(0,0,255,.45), 
15px -20px 20px rgba(255,0,0,.75);
-moz-box-shadow: 0 0 20px rgb(0,255,0), -10px 5px 4px rgba(0,0,255,.45),
15px -20px 20px rgba(255,0,0,.75);
box-shadow: 0 0 20px rgb(0,255,0), -10px 5px 4px rgba(0,0,255,.45),
15px -20px 20px rgba(255,0,0,.75);

5-boxshadow.jpg

 

 

5. Multiple Backgrounds

Supporting Browsers: Apple Safari 1.3, Google Chrome 1

Including multiple background images in a single element simply requires additional sets of values to be added to the background properties, separated by commas. You should include a single background image as a back-up for other browsers:

background-image: url(astro-127531.png);
background-image: url(astro-127531.png),url(Hubble-112993.png);
background-repeat: no-repeat;
background-position: bottom left;
background-position: bottom left, top right;

6-multiplebackground.jpg

 

 

SPECIAL BONUS

Rotate Anything!

Supporting Browsers: Apple Safari 4, Firefox 3.5, Chrome 1

Although not even a part of the CSS3 specification yet, Webkit has implemented its own transformation property, which Mozilla is following suit with. Transform can include a number of different value types, but one of the most intriguing—and useful as a design enhancement — is rotate:

-webkit-transform: rotate(-15deg);
-moz-transform: rotate(-15deg);

7-rotate.jpg

 

Appearance as seen in browsers that do not support CSS3 (e.g. Opera 9)

8-nosupport.jpg

 

See the live working example (requires Safari 4+, Firefox 3.5+, or Chrome 1+)


Jason Cranford Teague is the author of Speaking In Styles: The Fundamentals of CSS for Web Designers. Get it now from Amazon for 27% off the cover price.

Do you use any design enhancements in your websites? Please share your examples with us!


  • http://www.crea8iveart.com Waheed Akhtar

    Cool stuff!
    What about IE 6 and IE 7?

  • http://www.webdesignerdepot.com Walter

    @Waheed Akhtar: not supported by IE (any version)

  • http://fwebde.com/ Eric B.

    Nice enhancements. I guess I shouldn’t use them all together, though! :P

  • http://www.johanbleuzen.fr ZenZen

    Nice article for nice enhancements….
    I use almost everything listed here and I don’t care about IE users… :p
    These are going to be the norm so we better start use it now and see how IE will deal with these….

    • http://www.thejoe.co.nr/ TheJoe

      actually you should care about ie users.. what if an IE user comes to your site and find it unaccessible?
      U’ll lose a reader/buyer/opportunity.

      Anyway even if theese effects are great we should wait some time to get em working properly on any browser.

      • PatrickHazard

        If everyone does that, there will be no incentive for the ie users to change. If you make it look better on proper browsers and users gradually start seeing that websites look better on their friends computers (as they’ll have no idea what a browser is, if they did they wouldn’t be using ie) or they get pop-up saying that this function doesn’t work with ie and a link to google chrome (they’ll probably already use google and trust the brand and than have any idea what firefox is) then they might learn and we can eradicate ie.

  • http://www.samotoring.co.za anil singh

    very interesting and useful info techniques

  • James Bull

    This is a great list, and a must read for web designers to stay on top of their game! Thanks for the tips!

    One thing I found interesting though, is that while viewing the live working example provided above in Safari 4, I noticed some rendering issues with the rounded corners. When viewed in Firefox 3.5, these rendering issues dont appear. Any thoughts?

    Also, stretching the browser window and watching the example stretch out as well was really cool. Looking forward to see how web developers can creatively use these new features!

    • http://www.speakinginstyles.com Jason Cranford Teague

      Glad you enjoyed the tips.

      There are some issues with corners, especially with clipping content (it’ doesn’t happen), but in Sa4 there is a slight artifact between the rounding corners and the side borders if you are also using transparent colors. Hopefully this will be rectified in future versions of Webkit.

      And yes, I spent quite a while playing with that example get those backgrounds just right (plus it was fun).

  • http://wordtaps.com mupet

    Nice experiment, but rounded corner not rendering properly in safari 4

  • http://creative-boy.com allahverdi

    Still…. Kill IE6 :P

    I wonder how Design World would be if there were NO IE! :D

  • http://www.empfehlenswert-wien.at erk

    very cool. and is there already a site with css3?

  • http://www.aledesign.it aledesign.it

    who is IE6?? I forget! but in any case is really incredible what we can make now with css..

  • Mrcl

    At first I wanted to reply something like: “Useless, no IE compatibility at all!” but then I figured we can simply use these CSS-techniques to enhance our web apps, as long as it still looks pretty in IE7+.

    But still, rather than multiple backgrounds I’d prefer to use PNG images and multiple DIV-tags overlapping. That way you can get it to work in IE7+ and also Firefox, Safari and Chrome.

    So that’s one bit of criticism: You’re suggesting techniques that simply will not work in the browser that is used by the vast majority of internet users. There are alternatives. And you are not suggesting those. We’re professionals here (I hope) that need to appeal to their visitors. That often means that 80% of your visitors are IE-users, and you aren’t going to change that by showing squared corners instead of rounded corners.

  • http://www.meilione.com meilione

    nice! I like it

  • http://lessfussdesign.com Andy

    Surely IE8 can support it?

    • http://www.speakinginstyles.com Jason Cranford Teague

      nope. And the signs are not good for IE9.

  • http://www.itbreaks.com sylvain

    Multiple Backgrounds
    Supporting Browsers : Firefox 3.6 !

  • http://www.dileepsharma.com Dileep K Sharma

    I wish IE could have supported CSS3. A nice article in fact.

  • http://kaiernweb.net Kaiern

    Stranglely, none supported by IE. I’m so surprised.

  • http://deconstructioncode.blogspot.com/ choen

    looking good, thanks.

  • http://jacobrask.net Jacob Rask

    Hi, nice writeup! Opera support text-shadow as well though, and also background-size.

    [disclosure: I work as a web developer for Opera Software]

    • http://www.speakinginstyles.com Jason Cranford Teague

      Is that opera 10 beta? I was only considering the most recent full release.

  • http://www.robertvanhoesel.com Robert van Hoesel

    Note that eg. round corners can be used in IE trough using the ultimate outcome for webdesigners: Jquery.
    One thing you might not know about jquery is the built in function that replaces the standard CSS3 name and value to a transformed browser friendly version.
    eg:
    border-top-right-radius: 5px; (standard CSS3)
    will also add:
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;

    Just like the way it does when using opacity.

  • http://devesigner.com Lamin Barrow

    These are really cool things you can do with CSS3 today. I use to be the biggest Microsoft fan boy but these days i can clearly see that IE is seriously hampering our progressive enhancements to the web. Why bother do these cool nifty things today when you know that all that stuff will only be visible to a fraction of internet users? Honestly, i wish IE will just die or atleast they (Microsoft) should ditch their Trident rending engine in favour of a more mature framework such as Gecko or Webkit.

  • http://newlayer.hu david

    I was looking for a way to add shadow for a text by CSS for a long time. Thank You!

  • Art Lawry

    The title is a bit misleading.

    “5 CSS3 Design Enhancements That You Can Use Today” implies that these are the CSS3 effects that are supported across all major browsers in one way or another (not the case as all of these degrade poorly or break design in IE) or that they differ in some way from the other CSS3 enhancements that are available to use in certain browsers (in which case the boundary line is not clear).

    It’s true that these are “FIVE css3 enhancements that you CAN use today” (emphasis mine), but it might have been better to discuss all CSS3 enhancements and what browsers support them or to better identify what makes these 5 enhancements stand out (cross-browser support, graceful degradation, etc).

    RGBA and rotation are the two that are difficult to see as degrading gracefully.

    • http://www.speakinginstyles.com Jason Cranford Teague

      You are welcome Art.

      • Art Lawry

        It was not at all my intent to come across as rude or unappreciative. You explained how to use these techniques just fine, and many people have already pointed that out.

        I offered an opinion on the possibility of a disconnect between the expectations built by your article’s title and the content itself. I would not have voiced that opinion if I didn’t think it might be shared by others coming to this page, but it is an opinion, no more, no less.

        My apologies for any hostilities that were inferred from the original comment. They were most assuredly unintended

  • http://www.opera.com/developer/ Andreas Bovens

    Text-shadow (incl. multiple text-shadows) has been supported since Opera 9.5
    Support for transparent colors is in Opera since 10 alpha.

  • http://www.kamikazemusic.com Dave Sparks

    Some great stuff to start using, although I’m looking forward to trying to explain to clients again why their site doesn’t look the same in IE6!

  • Bryce Carr

    Opera can do most if not all of these… Why isn’t it listed as a Supporting Browser?

    • Bryce Carr

      I apologize, they do not work.

      • Horst

        Oh Opera is such a nice browser! box-shadow and border-radius work without this nasty -moz or -webkit prefix. The W3C validator says that it’s part of the css3 specification and that -moz-border-radius is not valid. Its a shame that the new firefox beta does not support valid rounded borders.

    • http://www.speakinginstyles.com Jason Cranford Teague

      Which version are you using? My testing and research shows that they will be available in Op10, which is still in Beta.

  • r_jake

    Not sure about rotate – if it’s not in the spec it’s probably best left alone for now. Also text that doesn’t flow horizontally is bad for readability/accessibility.

    @ZenZen IE 6-8 users still have the majority of the market share, and it has taken Microsoft almost ten years to reach a reasonable level of support for CSS2.1, will probably take the same for CSS3

  • http://gyppi.ru mrak911

    Very interesting. What about FireFox 3.5.2?

  • http://www.andrewgjohnson.com Andrew

    Informative stuff, but if it doesn’t work in IE then I can’t use it today…

  • http://www.plasticprinters.com/designerbusinesscards/ Anthony Proulx

    Nice tips, I’m glad we are getting around dumb ie issues.

  • http://www.blog.exxcorpio.com Luis Lopez

    I really have to put myself on the CSS3 because I am still working all in 2, cause my clients want to be ok in any browser. but next time noc are about IE “i must see wath the client thinks but….”
    This kind of things are really useful, thanks for the tricks.
    I love the idea of rotate…. let’s see what we can make with it.

  • Nick

    Good article! Looks like FF3.5 doesn’t display multiple background images…

  • http://parisvega.com/ Tuscaloosa Website Designer

    These are huge time savers. With all this fanciness being handled by CSS3 Photoshop will only be needed for photo manipulation and graphic embellishments. Rotate!

  • http://www.davetyler.net dave

    NICE CSS =)

  • http://mynameisjay.com Jay

    Very cool! Unfortunately though, I won’t be using most of these features until 2036, when IE6 finally dies.. :(

  • http://brettjankord.com Brett

    @ZenZen While not developing for IE may work for you, most clients I’ve had still use IE. I do think if people start using these new techniques in sites it may help push IE to support the new techniques, yet I won’t be able to use them until they work for my clients.

  • http://www.boese.net svenjo72dpi

    I do not see me using any of these soon…

  • Gabrioch

    IE6 Sucksss!!

  • http://www.sametomorrow.com/blog Adam

    Nice post, I’m not sure if these may work with all browsers but for ones they do definitely beneficial.

  • http://www.charlescharmon.com/blog/web-designers-of-reno Chuck

    What a great selection. I especially like the opacity feature and can’t wait to give it a try. Thanks.

  • http://www.dominiondigital.com Darrell Estabrook

    I would disagree that these 5 enhancements are simply ones which, if disabled, would only diminish visual appeal yet retain usability. Visual appeal is not just some secondary appendix which is tossed in at the last moment–it is just as important as usability since you can make things easier to use through visual design.

    Looking at this from the perspective that there should be a purpose for every design element (i.e. “what are you communicating by using that treatment”), things like drop shadows and rotation are major design elements. Why you choose to treat elements the way you do should be paramount in the designer’s mind.

    Of course, the last example of this article (Special Bonus section) is just to demonstrate these 5 enhancements simultaneously, however I would find it hard to argue that the bottom example simply lacks visual appeal and that’s okay. These are two drastically different designs.

    In a real-world case where you may only use one enhancement in one browser but not in another, there might (maybe) be an argument to support using it, but again I ask why? If your design can stand without the enhancement, don’t use it–if it can’t stand without it, find another way to support it in all browsers.

    As Designers, we can complain about IE all we’d like as it inconveniences us to develop, however it has the largest market share (http://marketshare.hitslink.com/browser-market-share.aspx?qprid=0) and we need to innovate around the design problems. On a more localized scale, we need to assess what our client’s browser stats are and see who is in the majority and approach our designs accordingly. If Firefox is 90% of your client’s base, then you can leverage these techniques with ease.

  • Dave

    … I think I’ll wait. If it’s not in IE then it’s barely practical for the real world. I’ll think about this in a year or so.

  • still rockin vinyl

    to all who have commented negatively towards this post because of the lack of IE support…

    how can we ever move on if no one will ever do anything that isn’t supported by IE? are all of you still listening to cassette tapes or 8-tracks (or cd’s)? if we keep restricting ourselves to what works in IE6, then the web will never advance. and the funniest part, is that this post was written to inform people of things that they can do that might enhance a design for users who aren’t using IE. did you microsoft fans even read this article or just the headline? “it doesn’t work in IE” isn’t a valid argument if the author clearly stated that it wouldn’t. what are you all gonna do when CSS3 becomes fully available for use in most browsers? you still gonna be developing sites for IE6 i bet. some people (myself included) just like to complain.

    anyways. good article. it’s nice to be able to play around with some of this stuff and get used to it in advance.

  • Dave

    @ still rockin vinyl

    Trust me, people who HAVE to develop for IE are NOT Microsoft fans. Most of us working in the real world have enough trouble getting things to work for IE that trying some CSS3 for 12% of the browser world just doesn’t seem like a good use of time.

    Those of us in larger corporations will have bosses/managers that will never view our work outside of IE6. It’s sad, but it’s reality in many places. My previous comment was never meant to be negative and I certainly FOR moving into the future ASAP and living in a world without IE6.

    I applaud the article and I look forward to using these CSS3 features in 3-5 years.

    .. on a side note, I would use these features if my user demographics called for it. I’ll bet that certain web-industry websites have IE users in the minority.

  • http://labs.dariux.com Dario Gutierrez

    Awesome features. Thanks for this great explanation.

  • Phil

    Nice article but Dave is right. Most of this will be useless in the real world for a good few years yet, even if Microsoft release IE9 with all the bells and whistles tomorrow.

    Another thing to consider is that unlike other vendors, M$ are very unlikely to implement these features based upon a working draft, and for a good reason. The sooner that CSS3 specification is finalised, the sooner we can expect them to do so.

    Minor typo in 4 by the way: “You can add multiple shadows just by including multiple values separated by spaces” – spaces should be commas, right?

  • http://www.benjaminpedroza.com Ben

    Thanks for the tips!

  • http://eveltdesign.com joel k.

    good stuff
    but you cant rely on it for layout and design yet
    only for enhancement – till ie caches on
    im useing 2 sets of css files (if mozzilla firefox end if etc…)

  • http://www.gummisig.com gummisig

    Great stuff, I´m allready using most of this stuff and enjoying myself (nerdy)

    It´s also so interresting to see that ther never is any support in IE in any version.

  • http://www.bluetubedesign.com Blue Tube Design

    Great post, have read a load of posts recently on CSS3 but very little have actually gone out and shown what it looks like, keep it up.

    Supporting IE is a pain in rear end and I agree with most of the comments regarding it holding back the widespread adoption of the new freedom CSS3 and HTML5 will offer up, however IE does account for a substantial amount of the market, as well as older versions, not only because users do not upgrade their browser but also because they do not have the ability to, i.e. corporations or big companies, so much as it causes us a headache, I believe we will just have to suffer the late nights until firefox, safari or whoever overtake microsoft.

    At the end of the day 4.5% of my web visitors last month were from ie 5.5, should I discriminate them or are these the guys that I will get the most trade out of. . .

    • Dave

      @Blue Tube Design

      Whoa, you still get IE 5.5 visitors??

      Out of 67,000 visitors last month, I had 11 IE 5.5 users. I’m not even factoring them in on anything. I had more people visit from a playstation 3 browser.

  • Phil

    @ Blue Tube Design: interesting observation – they may be a small portion but that’s not to say they’re unimportant. That’s the beauty of analytics ;o)

  • http://www.css3gallery.net CSS3 Gallery

    Great article on css3 modules, if you know of any worthy sites using css3 please feel free submit them on our new CSS3 Gallery

  • http://www.acaiberrystudy.net Acai

    I agree with most of the comments regarding it holding back the widespread adoption of the new freedom CSS3 and HTML5 will offer up, however IE does account for a substantial amount of the market….

  • http://gdkey.cn Joey

    Just use transparent sometimes. Rounded corners are useful, but I still use pictures to do that.

  • http://websayans.blogspot.com/ Sayans

    Muito bom – primeira visita e retornarei em breve

  • http://smithsrus.com Doug Smith

    For all those looking for IE compatibility, there is a filter that can make IE do rotation. For example, here are the css rules to rotate an object five degrees counter clockwise in all the browsers:


    .tilted-box {
    transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    filter:progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11='0.9999988', M12='.08715574', M21='-.08715574', M22='0.9999988');
    }

    Here’s the docs on how it works: http://msdn.microsoft.com/en-us/library/ms533014(VS.85).aspx

    Personally, I tend to add little CSS 3 embellishments that those with good browsers can enjoy and not worry about IE, unless it’s absolutely essential to the design.

  • http://www.sandersdesign.com Martin Sanders

    thanks for the article, most interesting. I believe progressive enhancement is the future with regards IE6. If users can see the site in IE6 but can’t access all the website eye candy this is fine for me.

    Not all browsers are equal.

  • http://www.archetype-media.com John

    I use the WebKit and Moz Border radius and they work awesome on my site, also…there is a great work around for internet explorer though that you can find by this guy Drew Diller called DD_Roundies that works great for IE…then you have nice rounded corners even in IE!

  • http://blog.twg.ca/2009/09/4-fears-of-font-face/ Vivian

    The possibilities of CSS3 are really exciting, but I’m also kind of scared about how ugly things can get…

    Text-shadows leave a bad taste in my mouth. Paired with @font-face and you might have a really ugly disaster.

  • http://www.ticketloot.com cheap jay z tickets

    Hey CSS3 is great. It has very nice features

  • http://www.nicewebstyles.com css ajax styles

    this is very good tutorial i learn very much from here

  • http://www.ticketloot.com cheap jay z tickets

    this is very good tutorial i learn very much from here

  • http://www.naver.com taeim

    Good Job!!

  • http://www.firdouss.com/ Fird

    Thank you for posting this article.

    The features of CSS3 that I am most amazed with is both border-radius and multiple-backgrounds!

  • Pascal

    No flash , No IE , Just CSS3 and js (our’s dream)

  • http://www.izmirchat.gen.tr izmir chat

    These are some really helpful tips. Thanks again.

  • http://www.sohbetmersin.net mersin chat

    Nice blogpost, good looking website, added it to my favs.

  • http://www.enterhelix.com/rathin Rathindra

    Great!!! öööööö
    Very Good

  • http://www.izmirchat.gen.tr izmir sohbet

    Nice to know about your experience there.

  • http://www.trmuhabbet.tk Muhabbet

    thnks

  • http://leica4.co.cc/ Leica 35mm

    This is good stuff, I like the illustrations along with the explanations. Thanks!

  • http://www.squidoo.com/30339/lloyd-pro-group-car-insurance-agency-in-atlanta-ga car insurance Atlanta

    Great tips and suggestions. As long as microsoft holds the monopoly on new computers there will be ie issues for web designers to deal with

  • http://ezinearticles.com/?The-Best-Drum-Machine-Software-on-the-Market?&id=3838901 Drum Machine Software

    Great stuff thanks

  • http://www.skiinfo.com/ Espen

    FYI, rotate is supported in Opera 10.50.

    -o-transform: rotate(90deg);

  • http://www.borektarifleri.net Börek Tarifleri

    Nice to know about your experience there.

  • http://www.wearingrainbows.com/mens-waistcoats-ties-c-2659.html Billy

    Great blog. but I see people are asking about IE. Dump it, it’s not worth using, more and more are using opera/Firefox/Safari/Chrome. It’s time to move on from IE

  • http://www.sevdali.gen.tr sevda Sohbet

    thanks.ss

  • Tayyab

    Nice article and very interesting features for futures.It ii reduce the workload of photoshop.Thanks

  • http://cartvscreens.org car tv screens

    Great article. I can’t remember the last time I used IE. Made a switch to the fox and been using it since.

  • http://www.ewallpaperstock.com/ ewallpaperstock

    Excellent articles and a lot of useful tips about CSS.
    Thx.

  • Andrei

    These features as with any other will never work properly on all browsers. Actually there are browsers and then there’s microsoft. Their job is to break the web so that people will be addicted to their desktop products. If the web was more robust, then it wouldn’t matter what OS you’re using as long as it has a browser. Real competition would put them out of business as they should be(msdos is pcdos repackaged, office is a clone of word perfect, windows = mac ripoff and so on). Why do you think they steal chineze facebook equivalents like common pirates? They’re not capable of ideas. All they think about is profits. IE9 passed 100% of their css3 tests and html5 but it passes 0% of the standard tests.

    • http://www.thejoe.it TheJoe

      You say “they” who r u talking about?? w3c? or the inventor of css3??

  • http://cliprz-php.com Bilal

    CSS3 support for Internet Explorer 6, 7, and 8
    For more
    Visit This Url
    http://fetchak.com/ie-css3/

  • http://ticketsurlooking.com/ Carrie Underwood

    nice tips on CSS but IE and Opera users are out!

  • http://affiliatemastersunlimited.blogspot.com/ Affiliate Masters

    This is what I’m after…Nice tips for css..I will gain a lot out of that..Thanks a bunch

  • http://www.fibroidsuterus.com Fibroids

    This is quality information and I will be using it to enhance the graphics on the site.

  • http://www.joeguty.com Joe Guty

    Dude…I am not much into design, but I do some basic stuff for myself and I got to see some of your designs and they are very cool. Keep up the great work!

  • http://www.squidoo.com/burlington-nc-painters tom

    I am not surprised that ie does not handle it.