• xxx

The common elements in the sidebar are:

• HOME LINKS - index, ask, submit, archive
• DESCRIPTION - where you enter stuff about you in the customize page's description box
• SIDEBAR ICON or IMAGE
• Custom Links
• NAVIGATION - links to move from page to page

floating sidebar: Notice as we scroll down the page the post column moves but the floating sidebar doesn't. If you try setting it to position: absolute; or position: relative; instead of position: fixed; notice the difference.

hover over description: is when you may see a sidebar picture and then you hover over it and it reveals the description or links.

tall sidebar - stylized: você precisa passar o mouse pra imagem aparecer

Back to transitions however - when we replace color: #colorcode; with background-color: #colorcode; or border: #px type #colorcode; we can see how it effects the transitions on hover.

The simplest way to explain it is for position: absolute; the key word is absolute. When using it in general, if you were to make the sidebar position: absolute; and then put top: 0px; and left: 0px; it would mean that the sidebar would be in the very top and very left of your browser and not stay 'fixed' as you scroll. Now when we have a position: absolute; div within a position: relative; div, it changes the ball game. When making a parent div position: relative; and then a child div position: absolute; instead of the position: absolute; div being positioned top left in the screen, it's within the parent div. more x