diTii.com Digital News Hub

Sign up with your email address to be the first to know about latest news and more.

I agree to have my personal information transfered to MailChimp (more information)


Super-Easy Blendy Backgrounds

Matthew O’Neill on a list apart has posted an article on “Super-Easy Blendy Backgrounds”. Here is what he says:

Recently, while trying to implement a few different navigation ideas that a designer had thrown my way, I became frustrated with my weak image editing skills. The design was gradient-heavy, so a traditional approach to navigation markup and styling would require a dozen or so background-image slices to meet the varying colors and height requirements.

After spending a mortifying amount of time creating the images—I’m a programmer by trade, so anything more complicated than MS Paint gives me the willies—I had to take a step back and figure out a better way. What if, after finishing, I needed to tweak the height? Or, God forbid, the color palette? My head was going to explode if I had to open an image editor again, so the Super Easy Blendy Backgrounds technique was born.
Continue for more info….

Here’s the final CSS in its entirety.

The final markup:


Super-Easy Blendy Backgrounds

Share This Story, Choose Your Platform!

Get Latest News

Subscribe to Digital News Hub

Get our daily newsletter about the latest news in the industry.
First Name
Last Name
Email address
Secure and Spam free...