Thanks for this article,

davidben — Mon, 14 Aug 2017 02:10:05 +0000

Thanks for this article, please post more tips for me to study.

Read this article when it

Renegade — Sun, 31 May 2009 21:43:00 +0000

Read this article when it was first posted and because I was bored, read it again.

Just two things I'd like to point out:

Quote:

You may be working on sites with large CSS files, multiple developers ,and long development timelines.

Quote:

Before adding a selector — particularly a generic element selector — make sure to check through you CSS first to make sure it hasn’t already been used.

Really good article

greg — Sat, 30 May 2009 00:52:34 +0000

Really good article Megan.

Having read through it all, I agreed with every bit of it, and actually am glad to say I do most of that anyway.
Although I never use @import for stylesheets, IE conditional comments or reset the CSS in the start.
Resetting is probably useful, but I tend to declare everything specifically these days anyway, as it seems to make code more x browser.

Logical flow / cascading was just something that I did from my starting to code. I'm fairly logical, so putting the CSS in the exact same order as the content it's used on the page just happened by chance (fortunately) as I code the HTML from top to bottom so make the CSS from top to bottom as I go along.

It's surprising to delve into other people's code and see how many people have it all over the place.
And IE conditional comments I just never wanted to use, sounds to hack-like. I guess it will be really useful/essential sometimes, but I've managed without it so wont start now.

Although listing the colours is a good idea, I might use that. I usually have Gimp open anyway and tend to use the colour picker, or Firebug is great too. Right click on the element with the colour and just copy it from the CSS on the right.

I used css for the first

NickD — Sat, 30 May 2009 00:01:05 +0000

I used css for the first time ever in my suckerfish nav bar, and (drum roll) it works ! even in IE ! (now)

Instead of adding a DIV to

webwiz — Tue, 12 May 2009 16:40:06 +0000

Instead of adding a DIV to IE with conditional comments (#17) I use this HTML:

<body id="toolbox">

In my CSS I can then put:

table ( font-size: inherit; }
.msie5-7 table { font-size: 100%; }

Also note that Steve Souders recommends you don't use @import.

Hmm, i still need to learn

ms2134 — Mon, 17 Nov 2008 06:36:26 +0000

Hmm, i still need to learn css, because i have been coing a few websites recently, but then again. I can only use basic css at the moment and need to take things to a slighly more advanced level.

~ Mike

ps. Some great advice, i shall follow and use as one of my learning guides.

avoid a flash of unstyled

decibel.places — Fri, 14 Nov 2008 20:36:34 +0000

avoid a flash of unstyled content that can sometimes occur with @import

I know that some Drupal template files have a comment "to avoid a flash of unstyled content" but I don't remember what the technique is.

Maybe it is here

jrbeilke wrote: I personally

Megan — Fri, 14 Nov 2008 18:19:00 +0000

jrbeilke wrote:

I personally use <link> instead of @import for my css files so that I can have additional css files for different media (print, etc.), and avoid a flash of unstyled content that can sometimes occur with @import.

I hadn't noticed that before, that the flash of unstyled content doesn't happen with <link>. I've been thiking about switching back lately because there's not much of a reason to block CSS from old browsers anymore using @import. That's why everyone started using it in the first place. AND, as you point out, some browsers ignore the media settings on @import. I usually use for print stylesheets and @import for everything else.

Nice article Megan. For the

jrbeilke — Fri, 14 Nov 2008 14:15:00 +0000

Nice article Megan. For the longest time I kept my css very basic, and not having additional comments, or a color reference was a bear down the road when something needed to be changed.

I now keep the original copy of my css (full comments, color reference, etc.) and then I minify my css by stripping out comments and whitespace for the smallest file size (I'm an optimization nut).

I also sometimes use @import within my css files if I need to include an additional css file, but this can get complicated/confusing when you daisy chain style sheets together.

See point #16 oops, sorry

decibel.places — Thu, 13 Nov 2008 01:40:15 +0000

See point #16

oops, sorry Megan - you got it covered... I searched for the word "hack" and - oh well

Regarding the nested Drupal selectors, yeah, that's why I use Firebug, to "Inspect" the inherited styles, I add a lot of selectors like div.someclass p#someid a (and if you try to reset just #someid nothing happens...) but I develop a lot of sites rapidly, and usually start with a gutted Framework theme for custom designs, or use 80% of an existing theme. (I like Twilight, Ability, Four Seasons - but that is probably worth a separate topic)