I’m thinking about starting another website. The sole purpose would be as a learning tool to others. CSS and HTML is pretty easy to learn but can be a little overwhelming at first. I sort of remember starting out and getting frustrated and reverting back to table based layouts several times. This site wouldn’t be like Chris Coyier’s CSS-tricks it’d be more basic, a starting point if you will.

My fears are this:

1. too much work, not enough time - will people use it and benefit from it or will I be spending several hours a week and no one uses it

2. how much is too much - do I really want to talk about basic html tags, I mean do I really have to start at the beginning and talk about how to set up an html document? Do I assume everyone that would read it knows what a paragraph tag looks like, or the difference between ordered an unordered lists?

3. Would this be like training someone to take my job? I understand that only people that want to make websites will try to learn how to make websites, and they’ll do it with or without my help, but would I be assisting my future competition? One thing I’ve noticed about the web industry is that most people are willing to help. There are some more experienced guys running around that have seemed to have become pretty cocky and they like to talk down to a lot of people, but overall it’s a pretty friendly community from what I experienced.

I don’t know, if anyone has any thoughts on the subject, let me know.

subscribe to my feed

It is pretty late so my first tip is going to be a short one. The more you start using CSS the sooner you’re going to discover the internet explorer 6 sucks. Before ie7 you could write little hacks write into your CSS without using a second stylesheet because safari and firefox wouldn’t look at your CSS that begins with #. Since ie6 doesn’t recognize the min-height attribute in CSS but uses height in the same manner the other browsers use min-height, you could follow your min-height attribute with #height.


#myDiv {
min-height: 500px;
#height: 500px !important;
}


Internet Explorer 7 also reads those # attributes though. Though height may not be that big of a deal, certain things are. Take this website for instance. If you’re in Safari, Firefox, or IE7 you’ll see a nice .PNG version of the navigation at the top. This makes the background a little more seamless because PNGs support alpha transparencies. However, IE6 doesn’t support the transparency in the PNG, you’d see an ugly grey box where the shadow is. So if you’re in IE6, you see a JPG version of the navigation background. It isn’t as pretty as the PNG in the other browsers, but isn’t as ugly as a PNG in IE6.

To use a conditional you have your normal stylesheet, then you have another style sheet with the IE6 specific attributes in. First you link your normal stylesheet, then you follow it up with the conditional statement. Mine looks like this:


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

The conditional is basically telling your browser that if the browser is less than IE7 (so IE6 and below) pull some styles out of the listed style sheet. Then in that style sheet I’m using the !important declaration on all of my lines. You can take a peek at my stylesheets if you want. Here is my default stylesheet and here is my ie6 stylesheet. There is a chance that there is a better way, like the # signs in the conditional stylesheet probably isn’t necessary. But, this is how I do them.

Looking at my post I see my code isn’t coming through very clearly - so definitely look at my style sheet and view the source of one of my pages - probably a non-blog page, like my home page, would be easiest.

subscribe to my feed