About the indirect adjacent combinator (~) in CSS

Similar to the CSS Adjacent Sibling Combinator that I wrote about before, the indirect adjacent combinator is pretty nifty and supported by IE7+, FF2+, Opera 9.5+, Safari 3+, and even Konqueror. It is actually part of the CSS3 spec but it’s surprisingly well supported. Here’s how to use it and what it does:

Using the CSS Indirect Adjacent Combinator

h3 ~ p {
  color: #FFFFFF;
  padding-left: 20px;
  border-left: 3px solid;
}

CSS Indirect Adjacent CombinatorThis would affect each <p> element that is a sibling of a preceding <h3> element. This is different from the Adjacent Sibling Combinator (+) in that it affects all following <p> siblings instead of just the immediate sibling. Let us see an example:

CSS Indirect Adjacent example

Example 1: Adjacent Sibling combinator (h4 + p) test:

Heading 4

Paragraph 1 - This should be gray and red

Paragraph 2 - This should NOT be red

Example 2: Indirect Adjacent Sibling combinator (h4 ~ p) test:

Heading 4

Paragraph 1 - This should be gray and red

Paragraph 2 - This should also be gray and red!!

Here is the CSS for the above example:

#indirect-example1 h4 + p,
#indirect-example2 h4 ~ p {
    background-color: #CCC; color: #F00;
}

Cool, yes? So you see how you can use this instead of the (+) selector to apply styles to the elements you want in basically everything except IE6-! This is a good example of something used for progressive enhancement that should be used to add detail to elements to give your users more information.

Update: Sorry for the name confusion. The latest draft of the CSS3 spec calls this the "General Sibling Combinator" and I didn’t think it had changed from "Indirect Adjacent Combinator" when I first learned of it so I used the latter. My apologies!

Have you ever used this? What was your experience and what ideas do you have for this CSS gem?

If you liked this post, please help me share it
  • Reddit
  • StumbleUpon
  • description
  • del.icio.us
  • Digg
  • co.mments
  • Google
  • Slashdot
  • Technorati
  • TwitThis
  • E-mail this story to a friend!
  • Furl

A quick way to backup a Firefox extension or profile

Suppose you need to send a friend a copy of say… Firebug 1.2 (site down at time of writing), but your favorite backup utility is not compatible with Firefox 3 yet. Not to worry! Just zip it up and send it like so:

Backup Firefox Extension

  1. Go to your Firefox extensions directory in your profile (WinXP default is C:\Documents and Settings\<user>\Application Data\Mozilla\Firefox\Profiles\<profile>\extensions\*nix is ~/.mozilla/firefox/<profile>/extensions)
  2. Zip up the extension you want
  3. Unzip in another profile extensions directory

One step command-line (Cygwin or Shell) example

#Make backup
cd ~/.mozilla/firefox/xxxxxxxx.default/extensions && tar -cvf ~/firebug.tar.gz firebug@software.joehewitt.com/
# OR to copy to another profile
cd ~/.mozilla/firefox/xxxxxxxx.default/extensions && cp -R firebug@software.joehewitt.com/ ../../yyyyyyyy.otherprofile/extensions/

You might even use it to play around with settings of your favorite extensions! I can’t verify this for every extension obviously, but the ones I’ve tried work like a charm! You can also do this with entire profiles!

Chuck Baker’s FEBE is my preferred way to backup a Firefox extension and my profile, but it is not yet compatible with Firefox 3 as of this post. Has anyone else used a different method or other suggestions? Let’s hear them!

Chuck updates us that FEBE 6.0 beta is available at: http://customsoftwareconsult.com/extensions/febe/febe60.html and is compatible with FF3! Great!

P.S. - I’m sure you’ve already heard about the Firefox 3 download day this coming Tuesday, June 17th. You have? Just checking. :)

If you liked this post, please help me share it
  • Reddit
  • StumbleUpon
  • description
  • del.icio.us
  • Digg
  • co.mments
  • Google
  • Slashdot
  • Technorati
  • TwitThis
  • E-mail this story to a friend!
  • Furl

What I wanted to know before I left college: A programmer reflects



A couple months ago I was at my Alma Mater Adams State College to talk about what I would have wanted to know if I was a student. I’ve been out of college for 3 years now, and held 3 VERY different programming jobs since graduating with my Bachelor’s Degree. I am hoping to shed some light on what I have learned about the "real world" and clear up some misconceptions.

Quick background

I just want to give you enough information about where I’m coming from here. Obviously, your experiences will be different but I think there are several things common to almost all workplaces and that is what this post will focus on.

I have done data-oriented programming, back-end programming, and web programming for a couple small companies and one quite large company. All of these positions were around Northern Colorado/Wyoming so we’re not exactly in Silicon Valley. If you really care about the details you can check out my LinkedIn page.

What I would’ve done differently

There are a few things that I would go back and do if I could:

  • Work with other OSes - I mostly used Windows because that was what we had in most of our labs. I would have been more prepared for the workplace if I had done more stuff in a shell. Go try out OpenSolaris or Ubuntu! Most of the candidates I see nowadays don’t have non-Windows experience, and it is really frickin’ valuable, I promise!
  • More research classes and internships - Do something outside your comfort zone! You can explore things that noone else has and that experience is absolutely invaluable. I really wish I had done the facial-recognition programming class or an internship at a bigger company. Don’t make my mistake.
  • Consider taking the SCJA or SCJP exams - My college program was Java-based but there were so many parts of the Java language that I really did not understand. I really learned a lot from passing the SCJP and I seriously recommend taking it as the knowledge WILL set you apart.
  • Connect with more people - I had what I would consider a rougher entrance into the programming world, and I may not have gotten a good programming job ever if I had not met some good companies at university job fairs. Take advantage of college job fairs outside your college

What I wish I’d known about the workplace

Eric Wendelin job resume

It was certainly different working on the same type of thing for many hours a day instead of the great diversity I had in school. My brain felt tired every day at about 4pm for the first month in the "real world", but I think it’s just because I was learning so much.

Another thing I was surprised by is that people in the workplace seemed more easygoing than I would have thought and socialization (face-time) is an important part of working. All of the places I have worked I would guess that people tend to spend about 3 hours per week socializing in one way or another.

I have not had to work more than 50 hours per week during most weeks at any of my jobs, but I have friends that do have short periods where they work 80 hours/wk or more. You should definitely ask about this during your interviews, since you don’t want to be surprised by this.

Company/workgroup attitude is the most important factor in how much I succeeded in my work. One major part of the attitude is trust: the managers/tech leads that trusted their engineers (including newer ones) to produce good work got it so much more than those that did not. Similarly, the groups that recognized that their engineers are an investment, and put money toward training etc., got higher quality work and probably more profit. When you interview with an engineer, ask how long it was since the company paid for training.

The best job is not usually the best-paying job. You need to factor in benefits as well as intangibles (e.g. can I work from home? etc.) and really think hard about it because it affects your happiness significantly.

What I didn’t expect to help me

Things that I didn’t think would matter so much but ended up driving a lot of my success:

  • Joined clubs outside of engineering - this helped me with my social skills a LOT and helped me become a better team member.
  • Summer internship that forced me to use computing languages that I had not touched before: Perl, PHP, and other CL tools in a mostly command-line Linux environment - Going outside your comfort zone ended up being HUGE in my career because I realized how to pick up technologies and try to build something useful with them.

What I thought mattered and didn’t

  • GPA? - nope, except that it will allow you to go to graduate school
  • General eduation classes? - do matter somewhat, because you have to be able to think like your diverse user base and this helps you put you in someone else’s shoes.
  • Who you know? - Yes! I had no idea how much knowing someone from a company would really boost your chances of succeeding.

Summary: Do these things to prepare yourself

  • Go download another OS like OpenSolaris or Ubuntu
  • Connect with others. Go to your local JUG. Join LinkedIn.
  • Make a good list of questions to ask potential employers
  • Take extra classes in technology
  • Apply for an internship, even if you don’t get it or want it
  • Learn something outside of the required courses
  • Consider blogging and/or mentoring

I have compiled a random list of job links that I think are helpful. Hope they are!

If you are a professional now, share what helped you or what you didn’t expect. I’ve only shared my views and yours would be extra helpful to those who need it!

If you liked this post, please help me share it
  • Reddit
  • StumbleUpon
  • description
  • del.icio.us
  • Digg
  • co.mments
  • Google
  • Slashdot
  • Technorati
  • TwitThis
  • E-mail this story to a friend!
  • Furl