Nice fading list / accordion created using hover transitions. The markup is a simple unordered list where list elements are used as the trigger to show the hidden
div that contains the hidden information. The fading transition is achieved by using the
transition property and transitioning between
To make this effect work in CSS-only, we have to define a height of the hidden
div which makes it incovenient to add different informations to different list elements. Adding a
auto height will not let the div to animate, so there's no choice here rather than having a fixed height for the div. However, this technique can be made useful by using a little JS or jQuery. Have a look at the source code.