Archive for the ‘tutorials’ Category

IE Conditional Comments

So you’ve created this beautiful design and it works in the most up to date browsers (Firefox, Safari, Opera, Chrome) and then you look at that little runt in the family IE and your design looks like it’s been made by a 12 year old. You can’t just ignore it because 80% of your clientele use IE (Why do they still use it? Don’t ask.) That’s where IE conditional comments come in.

IE conditional comments are a way to selectively “comment out” any portion of your page in a way that only IE can interpret or the other way around.

Here’s a general example of what you would see in your code:

<!–[if (conditional) IE (version)]>
comments here
<![endif]–>

Conditional variables:

!        The “not” operator.
lt       The “less than” operator.
lte     The “less than or equal to” operator.
gt      The “greater than” operator.
gte    The “greater than or equal to” operator

example:

<!–[if lt IE 7]>
<link href=”style.css” rel=”stylesheet” type=”text/css” />
<![endif]–>

In this example style.css would be used on any browser less than IE7.

Filed under: Web Design, tutorials by Afarr
Tags: , , , , ,
No Comments »

Web Tricks that I’ve Learned Today

On my adventures through Web Design I often find myself stuck on certain things and how to do them. Thanks to the world wide web and it’s many many blogs often a search or two on the great Google will help me figure things out.

Here’s a few that have helped me out today:

How to Add Twitter to your blog (step-by-step)

This one was great! I hate the clunky look of the widget twitter generates for you and wanted a simple way to add / customize it for a website. This is so simple, two plugs and you’re done.

Simple Double Quotes

I was having trouble figuring out how to have double quote image to line up with text. This tutorial provided an easy fix to my hour of frustration.

Filed under: Web Design, tutorials by Afarr
No Comments »