triskellian: (cartoon me ibook)
I don't really do 'favourite' things for most categories of thing, but it occured to me yesterday that I do have a favourite website: CSS Zen Garden.

It's not the site I visit most often (that's LJ), or the one I find most directly useful (Google), but it's my favourite. It's a piece of glorious CSS evangelism, demonstrating what's possible with CSS-based web design. It's effectively a one-page site, with many different stylesheets, all working on exactly the same static HTML document, and achieving wildly different layout effects. The home page remains the same, but there's an often-changing selection of user-submitted stylesheets, of which my current favourite is Museum (remember, that's exactly the same HTML as the homepage I linked above - it's just the stylesheet that's different). I go back to it over and over, looking at favourite designs, getting ideas from the CSS, and being re-enthused about the whole thing, and it gives me so much joy that I want to share it with you ;-)

Now, repay the favour. What's your favourite website, and why?
triskellian: (cartoon me ibook)
Situation: I need to upload some stuff to my NTL webspace.
Problem 1: My laptop, which contains the relevant settings, is five miles away.
Problem 2: The NTL website is claiming that the page containing said settings does not exist.
Possible solution: I know that some of you guys use NTL - can someone tell me the FTP host and the host directory? Or, y'know, direct me at free, ad-free, FTPable hosting, if such a thing exists?
triskellian: (cartoon me ibook)

I'm working on streamlining the CSS I was talking about in my previous post - some of it's clearly redundant, and there's no apparent reason for the third level to require a separate class from the first and second. But it's not working.

The problem is that the third level items are displaying when the first level is moused over, not when the second level is moused over. The reason for this seems to be that the first of these two bits of CSS is overruling the second:

li:hover ul { display: block;}
li ul li ul { display: none;}

This is the order they appear in in the stylesheet, which should make the second take precendence, but I guess 'li' includes 'li:hover'.

The best I can come up with is that I need a 'no-hover' pseudo class for the second li in the second bit, but such a thing does not seem to exist ;-(

Anyone got any ideas?

triskellian: (cartoon me ibook)
I mentioned on [ profile] secretrebel's journal earlier today that I'd been playing with a new CSS trick. [ profile] chrisvenus and [ profile] wimble both asked what it was, and I said I'd post the details here.

It's a nice method of making drop-down menus with CSS... I found the technique at A List Apart, but that only worked with two levels of nested menus. I've now fiddled with the stylesheet to make it work with three levels.

The working version is here, and this is the CSS. The 'leftcol' div needs to appear after the 'content' div in the HTML, to make sure that the expanding menus display over the top of the content div.

(To work with IE, the technique requires a teensy bit of Javascript, which is documented on the ALA page. I didn't include it, because I'm working on pages only I will use, and I never use IE.)

April 2013

141516171819 20


RSS Atom

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Sep. 23rd, 2017 06:18 pm
Powered by Dreamwidth Studios