If you were looking for some wise words about Brazilian electro then I’m terribly sorry :(

I’m typing up some interviews at the moment, and while I was doing my dip thesis (a long time ago) I read an a list apart article about lists and styling lists. At the same time I was using a javascript library to do the verification on my forms written by Andrew Tetlaw. By a stroke of such enormous coincidence that I was really very surprised by it, Andrew is now the web guy for BVN.

We talked through some stuff today and thought that you could make a CSS selector that would do the normal interview typesetting without too much effort.

• Can we do this with CSS?
• yes, it's easy
• I'm too stupid, show me how
• here you go:

/*style applied to the whole interview*/
ul.interview{
  list-style: none;
  margin-bottom: 0.8em;
  list-style-position: outside;
}
/*interviewer bullet*/
ul.interview li:nth-child(odd)::before {
  content: 'BD ';
  color: rgb(0, 200, 0);
}
/*interviewer text*/
ul.interview li:nth-child(odd) {  
  color: rgb(0, 100, 0);
}
/*interviewee bullet*/
ul.interview li:nth-child(even)::before {
  content: 'JA ';
  color: rgb(200, 0, 0);
}
/*interviewee text*/
ul.interview li:nth-child(even) {
  color: rgb(100, 0, 0);
}
/*each line in the interview*/
ul.interview li{
  margin-bottom: 0.8em;
}

There’s a load more tidying up that you could do with hanging indents and stuff, but that’s the basics of it.
Here’s something that Andrew wrote about nth child CSS selectors [Actually he says he was just the technical editor]

The really flare thing to do would be to have first and second lines showing the full name, and then 3^rd onwards showing initials.

P.S. The CSS in this post is made possible by using the scripts n styles plugin for wordpress.