Grow your CSS skills. Land your dream job.

#12: Converting a Photoshop Mockup: Part Two, Episode One

There has been LOTS of great feedback on the first series of Converting a Photoshop Mockup into HTML/CSS. So let’s do it again! Every website is different will require different …

#11: Working Modularly with PHP

Many sites do not use any fancy Content Management System (CMS) to generate their pages, they are just just good ol’ static HTML content. A site for your grandmothers pie …

#10: Fixed Width, Fluid Width & Elastic Width

There are three different types of layouts for websites: Fixed Width, Fluid Width, and Elastic Width. In this screencast we look at all these three varieties of sites out on …

#9: Starry Night: 3D Background with the Parallax Effect

Using three layers of alpha transparent PNG files, we can can create a pseudo 3-dimensional looking background for a web page. This screencast covers how to do that from start …

#8: CSS Formatting

Being organized and using good formatting in your CSS files can save you lots of time and frustration during your development process and especially during troubleshooting. The multi-line format makes …

#7: Three State Menu

Using a variation of the CSS Sprites technique, we can create a “three state” menu using only one image per menu item. This reduces the number of requests on your …

#6: Tools of the Trade

Before I get too far along in these screencasts, I thought I would introduce you a little to my working environment and explain the tools that I use. First off, …

#5: Columns of Equal Height: Super Simple Two Column Layout

Forcing multiple columns to be of equal height is one of those tricky things in web design. In this screencast I’ll show you a little trick around it. Instead of …

#4: Forcing Scrollbars: Eliminating “Horizontal Jumps”

In this screencast I talk about how to force vertical scrollbars onto websites. Without doing this, pages with centered content can appear to “jump” to the left or right when …

#3: Converting a Photoshop Mockup (part 3 of 3)

I finish up the design in part three of this series on coverting an Adobe Photoshop website mockup into an actual HTML/CSS website. This one focuses on the main content …

#2: Converting a Photoshop Mockup (part 2 of 3)

In part two of this series on converting a Photoshop mockup to an HTML/CSS Website I continue on with the header/menu section of the site. I change the way in …

#1: Converting a Photoshop Mockup (part 1 of 3)

In this first-ever video podcast, I start the conversion process of an Adobe Photoshop mockup of a website, into a real live CSS based website. This is pretty rough here …

*May or may not contain any actual "CSS" or "Tricks".