A small step

[binidj]

So last night I stayed up until stupid o'clock futzing around with the CSS of my LJ style. You see there had been a couple of things which annoyed me about the way in which my journal style displayed certain elements and suddenly I discovered that you can add CSS code which overwrites the stylesheet of the style you're using ... woot! If only I hadn't discovered this just as I was about to turn the PC off and head to bed.

The most irritating thing for me was that journal entries were wrapping around the user-icon in a very unsatisfactory way, leading to all sorts of legibility and layout issues. So after a couple of hours of tinkering¹ I managed to force the text not to wrap around the icon but to float to the right of it.² this also works on the class "comment-even" but, for some reason, I can't get it to work on the "comment-odd" class ... it's as if I'm calling the wrong class but I've checked the spelling and it's correct.³ Ah well, I might come back to it in due course but for now I'm happy having a journal style that displays (for the most part) how I want it to ... I also made the header div a little wider so that all the regular links appear in one line now instead of the, rather odd, two lines it was using before.

So, all-in-all a triumph, albeit one tinged by a frisson of defeat.


¹ And thank the gods for Firefox's web developer toolkit.
² No, it wasn't that simple ... the solution involved playing around with padding and margins ... eventually.
³ Yes, I know they've actually used "comment-odd comment" but omitting the redundant "comment" works fine with comment-even so why not with comment-odd?

Comments

[wildwinter.livejournal.com]

Yep, I was quite impressed by how easy it was to customise. Odd layout language (why not use something that already exists?) but useful in the end.

[caddyman.livejournal.com]

This sounds fan-frikkin-tastic!

I don't understand a word of it.

[irdm.livejournal.com]

I've always thought it was a shame CSS didn't do inheritance and modification. e.g. class fred is class bill with these bits, or make the xyz setting in bill be this.
Oh and those what-overrides-what-and-when rules!...

FF web dev toolbar is The Best!!!
The on the fly validator is handy as well.

[furzepig.livejournal.com]

This may not be your problem, but I *think* this may need a comma:
.comment-odd .user-icon { STUFF }

Should be...

.comment-odd, .user-icon { STUFF }

At least, I think so. Not been able to find a conclusive answer in a brief search. This is assuming you're trying to apply the same bit of CSS to two different class names.

[furzepig.livejournal.com]

Annoying wrappage - I see what you mean. :-)