Here's something obscure... Never leave out anything important.
CSS has a parameter called !important that fits at the end of a statement, just before the semi-colon (;). Its job is to place priority to a statement that is addressed in a style sheet your page loaded first.
Here's an example:
Your lounge's MOTD contains the style tags that control your lounge's background. Somewhere in there, in the body{} section, is a line that reads:
background-image: url('http://www.fubar.com/someimage.gif');
When you edit the MOTD, you're actually affecting the output of a file called "new_lounge.php". By itself, that statement would place an image located at the provided URL into the background of your lounge. However, what if the stylesheet "new_lounge.php" inherited from happened to contain a definition for body{} already? Actually, it happens to: a part of utils.js (JavaScript) actually sets that background (through CSS) to a solid black, 1x1 pixel black dot, tiled everywhere (that is, it's now a solid black background).
What do you suppose happens when Fubar gives the original JavaScript the green light? Well, you now have two conflicting lines of CSS, both of which ask to reset the background image. The parent container takes priority... which is the style sheet you've inherited from. And, depending on how fast everything loads, you may wind up with a "flash" effect as one background appears briefly, and then gets overruled.
And that's what's so important about... !important. If the code now read:
background-image: url('http://www.fubar.com/someimage.gif') !important;
... then it wouldn't matter what other CSS said - your intended image will show up and stay there.
Yes... Apparently it's that !important.