Opal for Scrapbook

[tinyjo]

woo! Finally got a solution for a personal web design holy grail - a fluid css layout for gallery thumbnails requiring neither fixed width nor fixed height! I have to admit that I didn't come up with it myself, but found it here. The CSS is a little bit hacky (although the markup is lovely) and my version won't work validate because I can't use conditional comments on LJ (all comments get stripped on SB by the look of it) but I got it working in both Firefox 1.0.7 and IE 6 on Win XP. Anyone with a different browser/OS, can you have a look at this gallery with some nice long descriptions and let me know if you don't see a nice tidy grid layout? Thanks!

camomiletea, I've run out of obvious things to implement apart from English stripping, which I'll do in a bit. What else would you like to see in the style? Any sidebar modules, SB features I've forgotten, anything you like really.

Also I would like to point out that I have been explaining this to Charlie as I go, just like the guy in my userpic :)

Comments

[shepline.livejournal.com]

Seems to work okay in Firefox 2 but it doesn't seem to like IE7 - thumbnails display down the page rather than across the page.

[tinyjo.livejournal.com]

Hmmm. Probably means that the hack I'm using to hide code from Mozilla is also hiding it from IE7 but they still don't interpret inline the same. I'll have to have a fiddle when I'm on an IE7 PC.

[despotliz.livejournal.com]

Looks fine in Safari 2.0.4 on OSX 10.4.

[ridicully]

Looks good to me in Opera 9.1 on WinXP

[diffrentcolours]

Looks OK in Konqueror 3.5.5, on Debian GNU/Linux 4.0

[burr86.livejournal.com]

Looks great in Safari!

[camomiletea.livejournal.com]

Oooh, pretty! I'll take a look tomorrow, since I was just going to bed, when I decided to check what I missed on friends page.

[camomiletea.livejournal.com]

I primarily had trouble figuring out where all the manage/navigation links should go.

Right now, I think that there shouldn't be that dark blue bar on Index with "Manage Account", and instead there should be a bar similar to the one used for Sorting links (and it should only appear to owner -- right now I can see the Manage Account, even though it's not my ScrapBook).

Gallery page should have a title somewhere, and I'm thinking that the dark blue bar would work well there. Manage links can go below in a light grey bar, like the one for "Subgalleries", "Pictures"...

I'd also like Manage (account, gallery if known, picture) links on Picture page; light grey bar, like where the title is would work. Navigation looks a bit crooked (spelling?) when the picture is the first or the last. I'm not sure precisely why. And that blue bar shouldn't appear at all if there's no information about gallery http://pics.livejournal.com/tinyjo/pic/000dtdg4/

Yeah, that was the most frustrating part for me, figuring out the logistics of what should go where.

As far as sidebars, can you add Page summary? That would be great.

[tinyjo.livejournal.com]

I have now appropriated the dark blue bar for the item ranges on each page so I've put the gallery & picture title in the header, like the LJ style does with subjects. I'm still not convinced the navigation is right though - what do you think?

[camomiletea.livejournal.com]

That sounds good, but I don't actually see the navigation links, and those should be seen by visitors, not just owner. I'm also seeing extra lines, which may be from the Manage links.

Screenshots at: http://pics.livejournal.com/camomiletea/gallery/0001f34h

Thank you for all of this! <3

[tinyjo.livejournal.com]

Oh, and you should not see the manage links now but they are there!

[camomiletea.livejournal.com]

Can I look at the code you have right now? I don't know if you are still working on it, but I guess I'll take what I can have and go from there ;)