Arrrr, yeah, I seriously thought I wouldn't get this finished this soon, but I did, and my body and mind are paying for it now. It's the new Tower RP Forums!
Please sign up if you're interested in Tower RP and/or FFRPG. I need to approve all registrations, but I'll be checking on the site as soon as I'm awake and able to think with more than like... four brain cells. :P
These were probably the most harrowing two or three days I've ever had of CSS HORROR. GOD. WHY DOES IT SUCK. It isn't even real programming, honestly, it rarely EVER makes logical sense. I had to seriously hack the heck out of my CSS stylesheet (which is a heavily modded Vanilla forum layout) to make it not look like crap on IE. Like, font-size:1px, and min-height:100% and and wrapper divs to trigger hasLayout! Or whatever that was... I don't even know if I REMEMBER all the hacks I had to do.
It was just... meh. NOT fun. I really had to nitpick over colors, too, and I'm not even sure if the colors will look nice for people who don't have a high quality flatscreen like mine. ;.; (Though changing them is MUCH less of a hassle than what I just went through.)
But... I don't really want to talk about all that now. I'll just chalk it up to "CSS HORROR" and put it in the back of my memory until the next time my mind randomly wants to finish an entire web layout and modification project in two days time. :P
...the sad thing is, I still chose that over actually writing a damn dice plugin. But to be honest? It probably would have taken me longer. HTML/CSS and a few tweakings of PHP may be tedious as hell but at least I already know how to do it.
I actually really like the Vanilla dice roller extension, though. It's all AJAX-y... you can actually order and sum the rolls by clicking right on 'em on your post. It's better than anything I would have done, that's for damned sure. It's a shame, actually, that the coder of that plugin didn't port it to other message boards, too, because there's plenty of others that could use a nice dice roller like that. (RPoL's is nice also. But RPoL was geared toward tabletop online RPG to begin with.)
ARGH but enough of that already! I need rest... once I go and crosspost the Tower RP news over onto LJ, anyway. ^^;
Ick!
Yeah, IE's really bad about keeping consistent. My web dev classes would generally focus on Firefox whenever we did CSS stuff, though we usually had to compare between browsers anyway to try to keep things together. Still, I hate working with IE. :(
If you're looking for some good ideas of what CSS can do for design, the CSS Zen Garden has some pretty impressive designs. The whole rule is that they can't edit the base HTML of the page, just the CSS portion. It's great practice getting used to what CSS is capable of...if not a bit frustrating at points. I remember having to make a Zen Garden page for my old class. (There was a lot of hair-yanking involved.)
Either way, that site's a pretty good source of inspiration. I'm pretty sure you can download each of the designs to pick 'em apart, too, so you could dismantle their CSS to see what they did.
I know of the site~
I know of the site. (In fact it's because of you I do :D) The problem is actually at least partially that I didn't get to do it from scratch, because it's actually me building a layout out of an existing layout for an app that has a lot of bits and pieces that need to be themed and put in the proper place.
When I build CSS from scratch, it is generally a lot easier, because for some reason people who make layouts for CMS/forum/etc. always make them unnecessarily complex. :P Like, too many repeated CSS tags and all that. And I'm basically looking at what someone else created and trying to figure out "why the hell did they do it THAT way?" what with all the 2341583 hacks there are nowadays to bypass IE's weirdness. Makes me want to cry. ;.;
Vanilla, much like Drupal is made a lot harder to skin for reasons like that. Just too many factors to account for!
But, I finished it, so I am happy about that.
Aiee! DX
Yeah, if there's anything I hate more than IE[6], it's trying to figure out someone else's code--whether it's CSS or C++ x_o I still manage to <3 CSS itself though, and it's really a breath of fresh air when I get to, say, theme chatzilla with it. Imagine it, coding for a SINGLE renderer! :P
Even Mozilla has its own fubar quirks though. Just recently I ran into a problem where FF2 would ignore a relative element when calculating its absolute child's position if the parent had display: inline-block (or was it -moz-inline-box for FF2? Whatever)... if you can decipher that ^^;; Basically, when you absolutely position an element, the engine is supposed to position it according to its closest relative or absolutely positioned parent. Instead of going to all the trouble of making an inside-wrapper div to relatively position, I just chucked FF2 the same style of downgraded CSS I was feeding IE6 >.>;;
The woes of css!
You're probably more thorough than I am. I really only checked with recent browsers (of which I have... FF3, um Opera 9.6? and whatever Safari version I last downloaded, along with whatever IE comes with Vista). I usually just think at a certain threshold, "y'know you guys just suck and should upgrade your browser." :D
There was a point I reached where I was just "I don't care how I do it as long as it works!" so I was like "ok fine if putting position:absolute there works, I'll just do it and not care~" My actual concept of WHY all of it works is a little weak, though I did barely grasp the whole IE hasLayout thing (the horrors of collapsed margins and extra pixel gaps! WAAH~!)
I think the worst part of my ordeal was all about IE support. It kinda breaks my brain that adding a particular element (like font-size or display or position) to the CSS actually makes a gap go *away*.
I am definitely not a CSS guru, though. It's kinda something I do because layout needs to be done. Then I think "make it go away!" Seriously. I might as well just make sites entirely in Flash (or is that hard, too? I don't know jack about Flash. :D)
BTW...
How do you usually do 100% column layouts with faux columns? I have a stupid hack in my css right now, but the REAL body tag doesn't extend further than the browser window size. I boggled endlessly as to why it does that, and then just stuck a wrapper div on the design. :P
Not sure what you mean...
CSS3 outlines 'real' collumn layouts for text, so we'll be able to use them eventually--but I assume that's not what you mean ^^
I don't really know what the 'normal' way to do things is, for a 'two/three-column' site where the 'columns' are menus or such, I would just put each one in its own div directly under the body tag, give the 'main' column margins on the left and right to make space for the menus, then absolutely position the menus... probably.
Every layout is different though, you might want to style the left collumn all the way down to the bottom of the page, in which case you might wrap them all in a div with a "background: top left repeat-y;"... or you might be concerned about the main column being smaller than the menus, in which case I'd check browser compatability for min-height...or maybe resort to something hackier x_o
I haven't been following
I haven't been following CSS3, that would be a welcome design. :O
I did end up using min-height: 100% but I thought that was frowned upon as hackish and not a 'real' solution. I suppose with CSS you kind of have to hack though :P