Adding An Outline To Your Text Using the CSS3 text-stroke Property

In this tutorial I’ll show you how to add an outline, or stroke, to your text using the CSS3 text-stroke property. Continue Reading »

Creating a Fading Link Transition with CSS3

Thanks to CSS3, Flash is getting more and more unnecessary. Can’t say I’m sorry, as I hate actionscript. In this tutorial I’ll show you how to create a fading link transition, on mouse over, with CSS3.
Continue Reading »

How To Create A Custom Border Using CSS3 border-image

In this tutorial I’ll show you how to use the CSS3 border-image property to create a custom border. This new element allows you to use an image for your border. In my example, I’ll show you how to create a 5px wide gradient border around an image.
Continue Reading »

Creating Slick Buttons With CSS3 Multiple Backgrounds

In this tutorial I’m going to show you how to make a slick button using CSS3 multiple backgrounds. The background property works the same as CSS2, with the exception of allowing you to add additional background images. If you’d like to code along, Download the source files.
Continue Reading »

Using The CSS3 box-shadow Property

I recently published a post on the text-shadow property. The box-shadow property is quite similar, and easy to build into your layout. In this tutorial, I’ll show you how to add a shadow to a box only using a little CSS3.
Continue Reading »

Adding text-shadow To Your Type Using CSS3

Adding a shadow to your text with CSS3 is actually quite easy. In this tutorial, I’ll show you how to use the text-shadow property to do just that.
Continue Reading »

Coding Transparent Backgrounds and Images With CSS3

Transparency has always been a stumbling block for web designers. However, thanks to CSS3, that is quickly changing. In this tutorial, I’ll show you how to use CSS3 to easily add transparency to backgrounds and images.
Continue Reading »

How To Create Circles With CSS3 and No Images

Thanks to CSS3 it’s now possible to create circles with only code. Look ma, no images! In the following post, I’ll show you how to create full, half and quarter circles using only CSS. Unfortunately, the half and quarter circles only work in Firefox at this time. The trick to creating the circles, is the use of the border-radius selector.
Continue Reading »

CSS3 rounded corners using the border-radius selector

Round corners, without the need of images, is one of the most exciting new features of CSS3. In the past, a web designer would have to use images and tons of code to use rounded corners in their designs. Thanks to the new border-radius property, designers can easily add rounded corners to their layouts.
Continue Reading »

Optimizing your images for Google and SEO

Image optimization for SEO is something that often gets overlooked in website optimization. There are a number of simple techniques you can apply to your images to make them easier for Google and other search engines to find. Therefore, improving the overall optimization of your website for search.
Continue Reading »