Skip to content

Latest commit

 

History

History
41 lines (23 loc) · 1.92 KB

README.md

File metadata and controls

41 lines (23 loc) · 1.92 KB

Just some other awesome CSS3 buttons

Whether you’re designing a website or a web application, you’ll need buttons for it. Now, with CSS3′s help, it was never easier to create nice looking buttons.

Go to the article

In order to create the icons, this set of CSS3 buttons uses HTML entities.

Why use entities rather than images?

  • Faster loading, because we’re talking about text here.
  • Scalable, depending on font size.
  • Styles as color and background are easy to update via CSS.

Minimal markup

<a href="" class="button">Button</a>

Simple button, with no icon.

<a href="" class="button add">Add</a>

Note the add class adds the plus icon.

Rendering & browsers support

The icons are added using the :before pseudo-element. Therefore, you won’t see any icons in browsers like IE7 and below, but the buttons will look good yet.

Please suggest improvements and/or additions that should be made. Also let me know if you branch it to use different colours (or other?). Thanks!

Written by Red

Catalin Rosu, a.k.a Red, is a professional web designer and developer who loves to be creative and enjoys CSS techniques. Stay tuned for latest updates, subscribe to RSS and follow him on Twitter.

The CSS has been copied to github without the author's permission, in order to create a backup and allow branching for colour themes and additions.