Thursday, August 10, 2006

CSS Menu

So I spent a good deal of today working on the P.Pole's menu that you see at the right. You might not notice anything different from before, but I cleaned up the coding and actually got it to have sub-menus, as you will see in The.Boxed section. Now that I set it up like this, I can make sub-menus by adding new lists and no more tinkering. Awesome stuff, yes? CSS is quite interesting and clean, but hard to use if you don't understand it (like me a couple hours ago). I've learned a bit more, but I am far from good at it. Anyway, it was fun and now I split the months into years first, making the entire list much shorter so it can be viewed within one window frame. Lovely, no? At first, I made the drop down menu (only viewable with internet browsers that don't suck -- i.e. IE) to eliminate the clutter created by a huge number of links to posts by months combined with the various other links. Sooner or later, I knew I had to do something again, because the list of just months was getting too long, even when just by itself. That's why I separated it into years, but the second tier of lists wouldn't work with my previous set up (which can be described as "terrible" and "disgustingly messy" at best), forcing me to Google up a new way to do it. After a few hours of hardcore tinkering, you have what you see now. Looks the same as before, but much cleaner and versatile. It was worth it.

EDIT: Another 30 minutes of tinkering just now and it's now unbugged.

EDIT2: Okay, waking up this morning, I had an epiphany. Using the "z-index" attribute, I promptly reconciled my previous problem with the width of the menu forcing the list items to run onto the next line (like an ugly ugly word-wrap job). When made the menu width: 100% before, the text would not run over anymore, but the pop-outs (ex: post titles or links to sites) would either pop-out way too far off to the right, or when moving over them, the original menu items (ex: The.Now or The.Rest) would take focus over the pop-outs. This made me angry. So angry in fact that I decided to settle on function (working pop-outs) over form (ugly word-wrap). I didn't take time to stop and think WHY. Anyhoo, long story short, the pop-outs now have higher priority than the original items, meaning that I can make the menu width: 100% (no more ugly wrappage!) while having the pop-outs take focus. Finally, I believe it is over. Time to back up my CSS template.

Labels: ,

Thoughts:

13:39, Blogger blkmage:

I love designing sites without having to care about people who use IE. And that's why I can't do any real work in web design.

 

Post a Comment

Back

© 2005-2006 Carl Wong. All unspecified works original content. Not for use without permission.
This page is best viewed with anything following web standards. Sorry IE.