A New Search Engine: DuckDuckGo

Did you know that Google takes you on a quick detour every time you click on a search result? So Google knows not only what you searched on, but where you went with that search which is all stored indefinitely in a database on their servers.

Read more »

Rotating Text & Making Columns with CSS3

Read more »

Encrypting Email

Here's a few options to help you encrypt your email.

Flat Design

Is less more in web design? Decide for yourself after reading this article that discusses the flat design aesthetic.

Believing in an Open Internet

A New York Times video by Brian Knappenberger.

Setting up SSL on an Apache Server

I administer my own Apache2 server running on Ubuntu, and I had previously setup SSL using a self-signed certificate. Recently I needed to start using a certificate signed by a Certificate Authority to avoid the "untrusted site" browser warnings. In this post I outline the steps I went through to set it up.

Read more »

CSS Vendor Prefixes

When a new CSS property is being developed, and does not yet have a final, consistent implementation across browsers, you want to write it using vendor prefixes for each browser. That's a total of four statements with vendor prefixes followed by the official, unprefixed property for future use when the new property's implementation is completed.

To review the prefixes, we have: -webkit- for Google Chrome and Safari, -moz- for Firefox, -ms- for Internet Explorer and -o- for Opera. If you are unsure whether a CSS property needs a vendor prefix, there's a website which will answer that question for you.

CSS Drop Caps

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ornare velit sed libero tristique, ut pellentesque quam porta. Proin iaculis posuere aliquam. Aenean semper vulputate nisl et ornare. In adipiscing pretium ante vestibulum faucibus. Cras molestie, urna vel dignissim sollicitudin, mauris nisl condimentum leo, sit amet hendrerit nisi magna ut lorem. Sed ac porta augue. Sed feugiat odio at auctor venenatis. Donec eu scelerisque neque. Nulla facilisi.

Sed tempus adipiscing eleifend. Aenean aliquam nibh quis enim varius cursus. Cras ut neque eget eros mattis volutpat. Nulla et pretium massa. Suspendisse potenti. Nam id quam mauris. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sodales, leo dictum tempor auctor, nulla urna commodo lacus, eget vehicula nulla neque mollis velit. Quisque lobortis feugiat pharetra. Vivamus id nibh facilisis, dictum dolor quis, mattis tellus.

Read more »

Data Security in Cloud Computing

Christian Science Monitor article discusses the impact of the government surveillance programs on the American cloud computing industry. A recent report estimates an average $30 Billion Dollar loss in the next three years for US based companies.

Related 2014 news: Internet Giants Erect Barriers to Spy Agencies | Germany Cancels Deal with Verizon | NSA and Your Phone

Popular Programming Languages

A visualization for the most popular programming languages of 2012 on CodeEval.

Replacing CSS List Bullets with Images Using Sprites

• To create a CSS list like this one, include the styles for numberedlist class and write your markup as shown in the blue box. You can switch to an ol from a ul if you think it'll help your code semantically
• You can build your own sprite image in an image editor such as Adobe Photoshop or use this image which goes up to number 9
• If you create your own image, compute the new offsets for the background-position property which is where the spriting is done
• Good luck!   

Read more »

CSS Image Grid by Floating Different Sized Elements

• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 

Ansel Adams Wilderness

© Copyright by Steve Dunleavy | Creative Commons Share-Alike License 2.0

The picture shows a mountain range on the Pacific Crest Trail. This is a follow up to a question in a previous image grid post. In this post, I have the first image displaying larger than the rest. The only significant difference in the code between this and that earlier post is the CSS rule that allows the first image in the list to be larger (CSS selector: #grid li:first-child img). The same thing could have been accomplished by giving the first li an id and targeting that id with the CSS rule. e.g. id="big-image" and #big-image. The other modification was to change the widths and heights in the CSS to reflect the different image sizes I am using here. Your grid images will likely be self-descriptive and distinct. The reason I used cutups from a single image was for simplicity.

Read more »