Angular Development Tutorials

CSS HTML

Oh Wow, That’s Neat – 04: Ink - Responsive Email Templates

January 30, 2014

Anyone who's ever had to create HTML emails knows that it sucks. You have to write old, crappy, code and inline style everything. You have to use tables because more modern float layouts just don't work consistently across the bagillion email clients that are out there. Overall, I would say that they are probably my least favorite part of the Job. But, they don't have to be. Thanks to the great folks at [ZURB](http://zurb.com/) we can hit the ground running when developing HTML emails.

Accessibility CSS HTML

The Difference Between CSS box-shadow and filter: drop-shadow();

January 27, 2014

Normally when I need to add a drop shadow to an element I will use CSS box-shadow. There's another way that I can handle this though. I can use CSS filters. They allow me to do many different things like apply gray-scale, apply sepia, blur, adjust brightness, adjust contrast, adjust hue, invert colors, saturate colors, and alter opacity.

CSS

Oh Wow, That's Neat - 03: Myth.io

January 22, 2014

CSS Preprocessors like LESS, SASS, and Stylus are all the rage now-a-days and rightfully so. They all do some great stuff allowing us to write CSS in a more programmatic way where we repeat ourselves less and operate at a higher efficiency level. With all the good that they provide for us they do add a layer of complexity.

CSS CSS Layout HTML

Understanding CSS Regions

January 20, 2014

Some of my favorite parts of CSS3 are those concerning layout. So far I've explored Flexbox and Columns, but today I'm going to dig into CSS Regions.

CSS HTML SVG

Quick Tip - 02: Use CSS Calc to Properly Position Background Images

January 17, 2014

If you would have asked me about the CSS Calc function six months or so ago I would have said "What's That?". But luckily for me I stumbled across some blog post highlighting the coolest new CSS stuff that's available for us to use and CSS Calc was one of them. It's really a pretty useful item to have at our disposal.

Animation CSS HTML

Oh Wow, That’s Neat – 02: iconmelon.com, svg Icons Lib for the Web

January 14, 2014

There are many pros and cons to using icon fonts and SVGs for icons in your designs. I had been under the impression that icon fonts were the more effective of the two but have had some reservations. For one, what happens if you need a multi-color icon? Remember, they are simply fonts so they have to be a solid color. The only way around that is to get all hacky and build the various components using other elements. The sizing of things is also a little odd since they are fonts they have to be sized with font-size and line-height which doesn't necessarily feel right. Using animations with them is also very limited when compared to SVG. And one last thing, they cant be set to scale at a percentage of their containing elements like SVGs can.

CSS CSS Layout HTML

All You Need to Know About CSS3 Multiple Columns

January 12, 2014

Layout has traditionally been a pretty difficult thing to get right when it comes to building web sites. With CSS3, however, it looks like things are getting a bit easier. I've written "Flexbox: Modern Web Layouts Simplified" which covered Flexbox layout techniques. That was cool, but there are other great layout features provided for us in CSS3, In this article I'm covering CSS3 Multiple Columns.

Animation CSS HTML

Oh Wow, That's Neat - 01: Snap.svg

January 10, 2014

For those of you that have read my post "SVGs are Cool & You Should Start Using Them, If You’re Not Already" you know that I am a fan of SVGs. In fact, now that I know a little more about them I feel that they are very under used in modern web development. They are light weight, resolution independent, and they really open up the door to so many possibilities for enhancing user experiences.

Favorite Web Design Development Resources

January 06, 2014

layout: post title: “My Favorite Web Design & Development Resources” date: “2014-01-06” tags: “CSS” “HTML” “JavaScript” “Resources” “SVG” “Web Development”—

Animation CSS CSS Transforms

How to Use 2D and 3D CSS Transforms

December 29, 2013

Most of the time when using HTML and CSS we are simply drawing flat rectangles, rounded rectangles, or circles within 2D space. CSS Transforms allow us to alter the shape, position, rotation, and scale of html elements within both 2D and 3D space. When combined with CSS transitions, transforms can really enhance the user experience although that topic will require its own post.

CSS CSS Layout Flexbox

Flexbox: Modern Web Layouts Simplified

December 20, 2013

New in the world of web layouts is the CSS3 "Flexible Box Layout Module" known as Flexbox. It is so new in fact that at the time of writing this post it is still just a W3C Recommendation and is still in flux with different browsers implementing things a little differently. That being said, it actually has been around since 2009 although the syntax was different. The most recent version of the module seems to be fairly stable with solid support among the latest versions of all major browsers.

CSS SVG

SVGs are Cool & You Should Start Using Them, If You're Not Already

December 14, 2013

Up until a couple of months ago I had no idea that there was even such a thing as an inline SVG. Once I found out I realized that I need to learn more about them. First off SVG stands for "Scalable Vector Graphics" which literally means just what it says. It's simply an image format containing XML code that describes vector graphics which can be resized large or small without affecting quality.

© 2026 Brian Treese. All Rights Reserved.