Internet Explorer Conditional Statements & Hacks

ilz — Sat, 25 Jul 2009 21:02:28 +0000

As a website designer, one of the challenges we have is making websites that look and function the same in a variety of browsers. In a perfect world everybody would use the latest version of the same browser. Then we would only need to design websites for this one browser. Unfortunately this is not the case.

Perhaps people are scared of updating their browser, or don’t even know why they should. Newer browsers have better security, and support the latest technologies we use as website designers / developers.

One of the largest challenges is dealing with the Internet Explorer browser. This browser is one of the most commonly used browsers, but always seems to make problems. I’m not going to go into the different issues IE creates, I’ll assume you know. The point of this article is to show the different ways of targeting Internet Explorer browsers with your XHTML / CSS. There are many different techniques, I’m going to show the ones I use most commonly.

Conditional Statements

Import a CSS style sheet if the users browser is IE

Import a CSS style sheet if the users browser is IE6

Import a CSS style sheet if the users browser is IE7

Import a CSS style sheet if the users browser is a version of IE before 7

CSS Hacks

Target IE with your CSS ( use star * )

#column {margin-left:20px; *margin-left:10px}

Target IE6 with your CSS ( use underscore _ )

#column {margin-left:20px; _margin-left:10px}

Lorem Ipsum filler text Cheat Sheet

ilz — Wed, 22 Apr 2009 23:41:57 +0000

What is Lorem Ipsum?

Lorem Ipsum is dummy “filler” text. It’s been used as filler text since way before websites were around, back to the 1500s actually. The purpose of using Lorem Ipsum dummy text instead of grabbing real text from somewhere is that you want your viewer to concentrate on the design of the piece, be it a printed piece or a website. You want them to know that there is text there, but not to worry about the actual content of the text. You don’t want them to get distracted reading about last weeks homer that Ellz-busy hit over the monster.. which you randomly grabbed off the Globe website for filler text. Get the point? Good.

So why am I making this post?

Isn’t it easier to just have a word doc with the text ready to be copied/ pasted? Perhaps, if you work on the same computer daily. As a freelance designer, I work on at least five different computers weekly, and I’m always looking for the dummy text. I use it at least every other day. I decided to make a post that I can just bookmark on every computer with the text, and when I need it I can copy/ paste from this post. Feel free to bookmark this post and use the filler text in your own projects.

Lorem Ipsum Filler Text Below

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

ilz out

WebDesign & Such » Cheat Sheet