this is portable

If you’re switching back and forth between AS2 and AS3 a lot, beware of mixing the two unintentionally. I’ve run into a couple of instances recently where mistakenly mixing the two highlights as correct in the editor and doesn’t cause any kind of error to be output when tested.

In light of that, here’s a couple of tips to help make sure you’re getting the code hints you want no matter which AS version you are intending to write using Flash CS3:

1. In the Actions Panel of a Flash document, open the left-hand side that you most likely keep collapsed to selection which AS version you will be using.
   
2. If you’re editing an Actionscript file in the Flash IDE, know that the code hinting and highlighting will always show hints for AS3. Proper AS2 terms will still highlight as expected but they won’t necessarily show up in the drop-down as you are typing.

Definition lists don’t get enough credit when you’re talking about XHTML and CSS. They can really come in handy when putting a site together but I think a lot of us forget that they are there for us to use.

So, here’s a quick example of how great these little bits of mark up can be to remind you that they exist.

This is actually the way I end up using them the most when cutting up a site — a small contained box of related content. Or, more specifically, a group of related links. Ususally these need to look like an actual box and be flexible enough to work with both a small and larget amount of content.

The markup part is really simple. (Actually, it’s all very simple, but the markup is the simplest part of the simple.):

Related Links
a first link to somewhere
another link to a site 
another link to a site 
another link to a site 
yet another link to a site 
another link to a site 

Now we add two background images, one for the DT and one for the DL. (false line breaks are noted with “>>”)

dl.list_show {
...
background: #e8e6e6 url(img/gr_box_bottom.gif) >>
 bottom no-repeat;
}

.list_show dt {
...
background: url(img/grn_box_top.jpg) >>
no-repeat;
}

The end result looks something like this:

The background image for the DT is just what you would expect, it’s exactly the size we need for the top part of our box.

The background image for the DL is a little different. It’s actually much taller than we’re going to need it to be. And, since it’s aligned to the bottom, the background of the box will “stretch” to fit the content. I’ve also set the background color of the DL to the same as main colour in the background image. That way, no matter how long the list is, our box background will still work.

Here’s the finished example

There’s a lot more that you can do with definition lists than just this example. MaxDesign goes into more detail of how and when to use definition lists in this article.