CSS3 support in Internet Explorer the easy way
jhnidk - January 10th, 2011 in: CSS, Graphics
Css3 offers a variety of new functionality that makes it easy to produce spectacular graphical effects like rounded corners, box shadow and gradient backgrounds without using external JavaScript or advanced markup with creative usage of background images.
The problem with CSS3 is that especially Internet Explorer 7 and 8 doesn’t support CSS3, which means that you risk that a huge part of your visitors can’t see all the nice eye candy you have built in CSS3.
The good news is that you don’t have to wait for Internet Explorer 9, before CSS3 can be used on your site. With the technique described in this post, you can actually learn Internet Explorer 7 and 8 to render beautiful CSS3
Jumpstart new CSS typography with Type-a-file
jhnidk - November 18th, 2010 in: CSS
Creating a CSS typography from scratch for a new website can be quite time consuming.
To speed things up, you might reuse CSS from other of your projects, or you might use some pre developed CSS classes, that you can then adjust to your needs.
In this post we’ll take a look at Type-a-file, that offers 8 different ready to use CSS definitions for your site.
Rotate images and text with CSS 3
jhnidk - October 5th, 2010 in: CSS
Rotated images can give your site or blog a interesting and modern look. Normally you would need to open a image editing program like Photoshop og Gimp, and manually rotate the images.
With CSS 3 you can avoid the manual work, and get the same effect by adding a small piece of CSS to you page.
Read more »
Adding text stroke effect with CSS
jhnidk - September 28th, 2010 in: CSS
Using CSS to create nice text effects is a good alternative to creating text effects as images, since the text is easier to update and maintain, and is performing better from a SEO perspective.
In this post you’ll learn to create a nice text stroke effect for webkit based browsers with CSS.
Read more »
Add gradient background to your text with CSS
jhnidk - September 6th, 2010 in: CSS
Adding gradient color to a text is typically achieved with a little Photoshop magic, however you can also create the same effect with CSS and a image with a gradient transparent background.
In this post you’ll learn 2 techniques on how to make a nice gradient background to your text with CSS, a general solution, and a very simple to implement solution, only for webkit based browsers.
Create a watermark effect with CSS
jhnidk - August 26th, 2010 in: CSS, Graphics
In some situations it can be handy to display information in a image as a watermark.
Traditionally, watermarks are added manually by graphical programs like Photoshop, which can be very time consuming.
Adding watermarks with CSS can make it very fast and flexible to add a watermark to many images.
In this post we’ll build a simple CSS class that can display a text on top of a image like a watermark
Create nice submit buttons with CSS and no images
jhnidk - August 24th, 2010 in: CSS
In this post we’ll demonstrate how submit buttons in forms can be styled with CSS without using any images.
If you’re very interested in creating nice looking websites with high performance, styling without images it’s worth considering, since it can decrease loading times of your pages, due to less http requests per page.
The examples in this post is both using standard CSS 2 and the upcoming CSS 3 to demonstrate some of the effects that can easily be applied to your submit buttons
Recent Comments