Editing SCSS with Brackets & Koala on Mac OSX

Made a tutorial video on how to edit SCSS (Sassy CSS). I will be using Koala & Brackets on Mac OSX. They are both free applications for the Mac. I reference a color scheme I made previously for a client. You will see the process of copying the hex codes to my WordPress Theme’s SCSS file. You will […]


SVG Animated Tooltip for Diagrams

Experimented with an idea for a site I’m working on in Codepen today. It involves some basic SVG animation with CSS3 and Jquery. I’m sure there is a more concise way of writing it, but this achieves the result I desired. Will work well for interactive diagrams. Hover over the black dots to see it […]


Firebug: An Essential Tool for Coding CSS

I find the Firebug plugin for Firefox to be exceptionally helpful when working on css.  For a long time, I didn’t even know about Firebug, and was doing it all the hard way.  Not anymore!  I discovered the power of inspect.  By simply pushing cmd+shift+c, I can open the firebug window.  From there, I can […]


Google Web Fonts API

Google Web Fonts

It used to be that you could only use the system fonts that came with every computer for web design unless you used images.  Those days are over.  Google has recently developed an API that allows you to embed a link reference to a currently small set of non-system fonts into your website.  This makes […]


Using Z-Index to Stack Design Elements

This is a really important little trick to know when you’re getting into using css and positioning divs.  Sometimes you may be surprised by a flash element staying on top of your dropdown menu for example.  This has to do with the z-index tag in css.  In order to set the z-index, you must first […]