Discuss: Keeping Your Elements’ Kids in Line with Offspring
by Alex Bischoff
- Editorial Comments
32 Forward Thinking
Of the three forward thinking methods, I like the third one the best, (just use the offspring classes). The reason I like this one is because if I do eventually want to remove offspring I can just do a find/replace on those classes.
posted at 07:35 pm on February 14, 2008 by Christian Schlensker
33 Piped separators: low tech solution
I’m currently working as stylesheet guy on Slantly.com – I developed a method for making pipe-separated horizontal lists with no requirement of :first-child (so no IE problem, either) => http://www.dillerdesign.com/css/cookbook/links_pipes_list_elements.html
posted at 10:27 pm on February 14, 2008 by Drew Diller
34 Should have elaborated...
My motive for leaving my previous comment was that use of :first-child was the first-real world example in the article.
posted at 10:29 pm on February 14, 2008 by Drew Diller
35 Small Error
Interesting script, Alex. I’m playing around with it right now on some dev sites at work :)
I just wanted to let you know that there is a small error in the “Applying Offspring to a specific section of the DOM” section. Where you have “Offspring.init();” and “Offspring.traverseChildren(tableNode);”, those first “O“s should be lowercase.
It took me a few minutes to figure out why I was getting “Offspring is not defined” errors, but a lowercase “o” sets everything right.
posted at 05:48 pm on February 15, 2008 by Jordan Haven
36 Dean Edward's IE7
Has anyone done a proper testing of Dean Edwards IE7 beta 3 script and if so, give some feedback.
I would very much like to use it, however heard a couple of annoying things such as frozen screens and very slow loading times.
Help would be appreciated. Thanks.
posted at 09:32 pm on February 25, 2008 by Andrej Telle
37 List item markers
I’m not qualified to speak on the script aspects of the article as I’m only just dipping my toe into javascript but the section of the article that suggests using an image to separate the items of a horizontal list bothers me a little. I like the reason for using it but if the viewer is using a large font size rather than a screen reader; the list-item markers won’t increase in size as the font increases. Would it not be an idea, especially as horizontal lists are so useful, to lobby for either a vertical line or for customised markers to be included as a list-item marker.
posted at 03:21 pm on February 26, 2008 by Simon Hingley
38 Untitled
The only part of offspring that I haven’t liked is the need to use class notation in your stylesheets instead of pseudo-classes, which means when browser support catches up with CSS3 (sometime around the turn of the next century, I’m sure) you’d have to go through and fix all your stylesheets. So I’ve devised a little script that you can run with offspring called pseudonut. It basically lets you use the css3 pseudo-classes in your stylesheet, and it converts them into the class notation for use with offspring. When CSS3-compatible browsers become commonplace, all you’d have to do is drop the scripts and you’re ready to go.
You can check it out at http://www.cssquirrel.com/2008/03/02/solving-impatience-with-pseudonut/
posted at 09:40 pm on March 3, 2008 by Kyle Weems
39 Thanks a TON!
For me this is perfect – and I’m loading offspring and the class notion styles via a conditional statement in the index file, so there is no extra overhead for any other browser than IE6, and no need to upgrade the CSS later
posted at 08:14 am on September 12, 2008 by Gretchen Zimmermann
Got something to say?
Discuss this article. We reserve the right to delete flames, trolls, and wood nymphs.
Create a new account or sign in below if you’d like to leave a comment.
Subscribe to this article's comments: RSS (what’s this?)




31 Funny fact
here’s a weird fact:
IE6 & IE7 implement the CSS3 selector “text-overflow” but Firefox and Safari don’t (haven’t cared to check it in Opera).
http://www.css3.info/preview/text-overflow/
Also, this seems like an awful lot of JavaScript for not much benefit you can have clean markup and utilize the selectors without all the extra javaScirpt. I’ll give it a try though.
my2cents
posted at 06:13 pm on February 12, 2008 by Tim Wright