I was watching the other day the talk that Lea Verou gave at Fronteers 2011 when she just proved that I don’t know CSS3 at all.

One thing caught my attention: CSS3 patterns. Making some of my own was the next step. It’s a great way of learning the specs a bit better cause I must confess I never read them properly and never bothered with the small details.

Inspired from the print world people from Adobe and Microsoft are coming with new features that might (or might not) be embedded into future CSS specs. These new features – CSS Regions and CSS Exclusions – will allow text to flow into webpages pretty much like they do in newspapers and magazines.

Ingredients:

sprites, unorderdered lists, Mootools knowledge.

Cooking time:

1 hr

Result:

Can be seen on our website – Rborn Web development – mouse-over the top menu.

Very simple problem with a pretty complicated solution, mostly because IE is ignoring the box-shadow CSS3 property. Instead progid:DXImageTransform.Microsoft.Shadow is doing the trick for it and an equivalent can be found.

The result?

I am sure you all know about Mictosoft’s IE9 Testdrive. Its main target was, for now, the developer – in an attempt to showcase the improvements in IE9 and maybe make us be more nice to them and forget how much time we waste with IE6.

What I was interested as a frontend developer was the the compatibility tables for features like SVG, CSS3 and DOM. And the test results, as per Microsoft’s page, are all gorgeous.

Styling a form is never an easy thing to do, but adding CSS3 on a HTML5 form is a task that shows a large variety of results when it comes to testing on different browsers. Check the test link. When it comes to CSS3 not much can be done: but adding rounded corners, gradients and [...]

A functional Mozilla menu roll-over effect – no preload necessary

We need rating scripts for different situations in our webpages. For example we want visitors to rate a wallpaper in a wallpapers site, or a product in a shopping cart. For this we can use one of the rating scripts presented below: Unobtrusive AJAX Star Rating Bar The guys from Masuga Design made this script [...]

As we said in a previous post we’ll try to bring here some resources related to CSS shadows applied to images or boxes. CSS shadow kerfuffle “… in addition to just the plain old img element, an enclosing div plus four additional divs to handle the corners”. CSS Drop Shadows This technique uses an outer [...]

Shadows are a graphical improvements for design or the website’s usability. We may want to create a design with shadows under images or boxes, but shadows also can improve usability and accesibility for the text positioned over the images. Text shadows In this post we’ll try to present some css techniques for text shadows and [...]