In web development, Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can be applied to any kind of XML document, including SVG and XUL.

Google Web Fonts for Programming and Code

Ok, so on a site like this one, there is a tremendous amount of 'code' styled with CSS fonts in a pre, code, var, tt, samp, or kbd html tag. When using an programming tool like VIM to write code it is shown beautifully using your OS fonts. So then, how can we get that same font beauty to be there on the web? And, of course the solution must use best-practices (and preferably only use CSS and (X)HTML).

Also, text effects! --> View Solution

Come On and Sprite for your Website

CSS Sprite, candid shotLet me show you an example that works so well I am using it right now on my site. Every page in fact. If you are a young or up and coming web developer with skills to pay the bills, lets make the future Net fast, learn about optimization and refactoring while you still have the chance.

Best CSS .Classes for CSS Toolbox

CSS Classes Toolbox .classCSS is one of the most useful tools I have in my toolbox as a Web Developer. Having a CSS Toolbox containing good CSS Classes that you repeatedly use is quite helpful for us XHTML / web-standards / best-practices developers. Check out 10 of my favorite CSS classes.

Review: Posh CSS has links to nice and new CSS Articles. Don't worry, they aren't snobs. ;)

CSS Background Image Sprites

Using a CSS Background Image Sprite with the CSS background-position and background-image I can display all these icons: . I can even have them show up anywhere on the page!

Getting flash to show up in front of content

Adobe Flash PositioningI used to have a problem of controlling flash elements on my sites.. On one site we have 6 different flash flv movies that are all the same size and are in the same position on the page. But only 1 is displayed at a time based on what the user wants to watch. So the selected flash movie needs to have the highest stacking order/zIndex.

PullQuotes using CSS

CSS, no javascript pullquote not blockquoteI looked at a lot of different ways to display quotes and pullquotes and even though the javascript solutions are very nice, esp. the solution, I decided to just use CSS (Keep It Simple Stupid).

Speedier Sites use CSS Sprites

CSS Image Sprite ExampleAn Image Sprite is simply multiple images combined into one image. Using the background-position in CSS you can display a specific image from the image sprite.

Sprites reduce the number of files that are requested and downloaded by site visitors, resulting in noticeable decreases in Page-Loading times, Bandwidth usage, and Server loads.

12 Lessons for Those Afraid of CSS

full article:

  1. Everything you know is wrong sort of
  2. It's not going to look exactly the same everywhere unless you're willing to face some grief and possibly not even then
  3. You will be forced to choose between the ideal and the practicable
  4. (with thanks to Antoine de Saint-Exupéry): Perfection is not when there's nothing to add, but when there's nothing to take away
  5. Some sites are steaming heaps of edge cases
  6. Longer lead times