Table of Contents
PlayGround
Hello! What's up?
Full CSS Selector Reference
Every CSS selector you could want for profile customization!
Theme Selectors.
These are the basic themes for the forum.
- #theme-melon - The body id for the default theme
- #theme-dreamy - The body id for the cinni dreamy theme
- #theme-news - The body id for the newspaper theme (theme made for readability; please stay extra mindful of this)
Important Note: It's highly recommended that you always use a theme selector for any of your other styles (for instance, using “#theme-melon #wrapper” instead of using “#wrapper”). Otherwise, setting any of the other selectors will affect all themes.
Page-wide Elements.
- .smiley - Every smiley on the page! (for instance, things like :ozwomp: or :eyes: )
Background & Image Link Elements.
- #shade - The div id that holds the rain background gif
- #shade-2 - The div id that holds the dust-cloud background image
- #shade-3 - The div id that holds the blinking-stars background gif
- #bunting - The div id that holds the 5-pointed-stars header gif
- #moon-link - The id for the link at the top left, the one that looks like a weird banana spinning around
- #radio - The id for the link at the top right, the one that looks like a radio
- #melonland-surf-club - The object id for the Melonland Surf Club link; contains an embedded document, so your results may vary!
Advanced CSS Selectors.
You probably shouldn't have to mess with these ones! Many of them are super-specific or don't respond to a lot of the usual styles. If you do mess with them, it's recommended that you know what you're doing beforehand.
Important Note: If you get locked out of your profile customization link because you went a little too wild with your CSS, then use this link to return to your profile-customization page!
- #wrapper - The div id that holds ALL visible elements on the page
- #moon-link img - The image selector for that weird banana at the top left.
- #radio img - The image selector for the radio at the top right
Nav Bar Elements.
- #melonland-surf-club + p - The holster for the forum links at the top (Home, Entrance, Wiki, etc.)
- #melonland-surf-club + p a - All individual forum links at the top
- #melonland-surf-club + p a:first-child - “Home” link
- #melonland-surf-club + p a:first-child img - “Home” link image
- #melonland-surf-club + p a:nth-child(2) - “Entrance” link
- #melonland-surf-club + p a:nth-child(2) img - “Entrance” link image
- #melonland-surf-club + p a:nth-child(3) - “Wiki” link
- #melonland-surf-club + p a:nth-child(3) img - “Wiki” link image
- #melonland-surf-club + p a:nth-child(4) - “Search” link
- #melonland-surf-club + p a:nth-child(4) img - “Search” link image
- #melonland-surf-club + p a:nth-child(5) - “Profile” link
- #melonland-surf-club + p a:nth-child(5) img - “Profile” link image
- #melonland-surf-club + p a:nth-child(6) - “Logout” link
- #melonland-surf-club + p a:nth-child(6) img - “Logout” link image
Info Bar Elements.
- #melonland-surf-club + p + table - The holster for the top info bar (with the forum logo image, time/date, forum activity rating & nav links, news bar, etc.)
- #melonland-surf-club + p + table tbody tr:first-child - The first row for the top info bar (with the forum logo image, time && date, “messages” link, etc.)
- #melonland-surf-club + p + table tbody tr:first-child td:first-child - The left half of the first row for the top info bar; holds the Melonland Forum logo
- #melonland-surf-club + p + table tbody tr:first-child td:first-child a img - The Melonland Forum logo image
- #melonland-surf-club + p + table tbody tr:first-child td:nth-child(2) - The right half of the first row for the top info bar; holds the time & date, “messages” link, etc.
- #melonland-surf-club + p + table tbody tr:first-child td:nth-child(2) a:first-of-type - The “Messages” link
Note: The second row here also has the class selector .windowbg2, so you may also alter its styles, at a class level, using that class selector.
- #melonland-surf-club + p + table tbody tr:nth-child(2) - The second row for the top info bar (with the forum activity rating, links for “Unread Topics,” “Unread Replies,” etc.)
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:first-child - The left half of the second row for the top info bar; contains the forum activity rating
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:first-child b - The “Forum activity rating:” and “Posts” text
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:first-child img - The stars image for the forum activity rating
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:nth-child(2) - The right half of the second row for the top info bar; contains links for “Unread Topics,” “Unread Replies,” etc.
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:nth-child(2) a:first-child - The “Unread Topics” link
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:nth-child(2) a:nth-child(2) - The “Unread Replies” link
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:nth-child(2) a:nth-child(3) - The “Own Posts” link
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:nth-child(2) a:nth-child(4) - The “Own Topics” link
- #melonland-surf-club + p + table tbody tr:nth-child(2) td:nth-child(2) a:nth-child(5) - The “Recent Posts” link
Note: The third row here also has the class selector .windowbg, so you may also alter its styles, at a class level, using that class selector.
- #melonland-surf-club + p + table tbody tr:nth-child(3) - The third row for the top info bar (with the news bar)
- #melonland-surf-club + p + table tbody tr:nth-child(3) td - The news bar
- #melonland-surf-club + p + table tbody tr:nth-child(3) td b - The “News:” text on the news bar
INVISIBLE-ELEMENT SELECTORS (don't use these names):
#melon-params #top