+

CSS|GUIDE

SIMPLIFYING YOUR WORLD

Welcome to CSS Guide! Please think of us as a sort of code "part shop". The purpose of this guide is not to detail every aspect of css coding, but to provide you with the bits and pieces necessary to make your own codes better. Therefore, we do not offer premade layouts here, however feel free to use these codes to make your own layouts.

Open since November 23, 2008.

UPDATES
[3/31/2014]: Hey guys! I thought that after 5 and a half years, it was time for a facelift! Hopefully you guys love it as much as I do. I made an effort to make changes based on feedback I've collected over the years. Even though I've made a few changes here and there, you should find that things are mostly as they were before. You'll find the majority of our codes are still here. I did throw out the basic layout codes because I thought they were a little too intricate for a basic code guide. I also threw out codes that are no longer needed! Since Neopets is no longer part of the Nickelodeon game hub, the white mambar is gone. So naturally, we no longer need codes to remove the bar. :3 A couple Guide areas have also been better organized and condensed. And clicking on the navigation above will still drop you to the area you're looking for. The nav even follows you, so there's no need for 50 of those "back to the top" buttons! (Although I did keep one just to get you closer to this update blog.) C; The layout is an experiment of sorts. I did it up as a premade for another site of mine and decided to put it to the test with CSS|Guide. It should work across the board, but let me know if you're having difficulties.

New codes have been added for rounding image edges. They are under the Userlookup Specific Image Codes section and the Other Basic CSS Codes sections. They are in picture forms because the code is restricted in petpage textareas. C:

Affiliates and link exchanges have been given a scrub down. I did keep a few inactive links purely because their content is still relevant and useful. I did notice a few of my listers were closed, but a couple had some kind words and mentions for CSS|Guide. It's sad to see you go, but thanks for everything, loves! C:
AFFILIATES
LISTERS
CONTACT
Please neomail Dark_riku_765 with questions and concerns. Although this guide can go long periods without updates, rest assured, I am online daily and frequently answer user questions.

Please let me know if you have listed my site or are interested in affiliation. I will add your link and/or respond back as quickly as possible.

REMOVING NEOPETS' WHITE BACKGROUND



REMOVING NEOPETS' WHITE BACKGROUND BORDER



REMOVING NEOPETS' WHITE BACKGROUND & BORDER



CHANGING NEOPETS' WHITE BACKGROUND COLOR
(BLACK)




REPLACING NEOPETS' WHITE BACKGROUND WITH A PICTURE



CHANGING NEOPETS' GRAY BACKGROUND COLOR
(BLACK)



REPLACING NEOPETS' GRAY BACKGROUND WITH A PICTURE
(CREATES A TILED BACKGROUND IN PETPAGES)




FORCING A BACKGROUND TO REPEAT ONLY VERTICALLY




FORCING A BACKGROUND TO REPEAT ONLY HORIZONTALLY




CREATING A NON-REPEATING BACKGROUND IMAGE




POSITIONING A BACKGROUND IMAGE IN NEOPETS' GRAY BACKGROUND SPACE
(NON REPEATING)




REMOVING ADS ON THE TOP OF THE SITE



REMOVING ADS ON THE BOTTOM OF THE SITE





REMOVING ALL ADS



REMOVING NEOPETS' HEADER & FOOTER
(FOR SHOPS, SEE SHOP SPECIFIC CODES)



REMOVING SIDEBAR INFORMATION
(FOR SHOPS, SEE SHOP SPECIFIC CODES)



HIDING A PAGE SCROLL



ENABLE SCROLLING WHEN NECESSARY



ENABLE SCROLLING EVEN WHEN UNNECESSARY

CHANGING FONT SIZE, TYPE, & COLOR FOR "WELCOME, GUEST | NP: 2,000 | LOGOUT" IN HEADERS
(TEXT & LINKS SAME COLOR)




CHANGING FONT SIZE, TYPE, & COLOR FOR "WELCOME, GUEST | NP: 2,000 | LOGOUT" IN HEADERS
(TEXT & LINKS DIFFERENT COLORS)


CHANGING FONT SIZE, TYPE, & COLOR FOR NEOPETS' COPYRIGHT
(TEXT & LINKS SAME COLOR)
(SEE PETPAGE SPECIFIC SECTION FOR PETPAGES)


CHANGING FONT SIZE, TYPE, & COLOR FOR NEOPETS' COPYRIGHT
(TEXT & LINKS DIFFERENT COLORS)
(SEE PETPAGE SPECIFIC SECTION FOR PETPAGES)





REMOVING NEOPETS' COPYRIGHT
(SEE PETPAGE SPECIFIC SECTION FOR PETPAGES)



MODIFYING THE NEOPETS CLOCK
(FONT COLOR, SIZE, & TYPE)





REPLACING THE HEADER IMAGE WITH YOUR OWN
(CHANGE HEIGHT AND WIDTH ACCORDINGLY)





REPLACING THE FOOTER IMAGE WITH YOUR OWN
(CHANGE HEIGHT AND WIDTH ACCORDINGLY)



REMOVING NEOPETS' HEADER
(FOR SHOPS, SEE SHOP SPECIFIC CODES)



REMOVING NEOPETS' FOOTER
(FOR SHOPS, SEE SHOP SPECIFIC CODES)



REMOVING NEOPETS' HEADER & FOOTER
(FOR SHOPS, SEE SHOP SPECIFIC CODES)



QUESTION MARK CURSOR



QUESTION MARK CURSOR ON MOUSEOVER



CROSSHAIR CURSOR



CROSSHAIR CURSOR ON MOUSEOVER



CROSSHAIR W/ ARROWS CURSOR



CROSSHAIR W/ ARROWS CURSOR ON MOUSEOVER



WAITING CURSOR



WAITING CURSOR ON MOUSEOVER



TEXT BAR CURSOR



TEXT BAR CURSOR ON MOUSEOVER



BLINKING TEXT
(NOT SUPPORTED BY ALL BROWSERS)



CHANGING FONT COLOR



CHANGING FONT SIZE & TYPE



CHANGING FONT COLOR, SIZE, & TYPE



CHANGING LINE HEIGHT
(INCREASE OR DECREASE DISTANCE OF ONE LINE OF TEXT FROM ANOTHER)




CHANGING LINE HEIGHT
(ALSO FONT COLOR, SIZE, & TYPE)



CHANGING LETTER DISTANCE
(INCREASE OR DECREASE THE DISTANCE BETWEEN LETTERS IN WORDS)



CHANGING LETTER DISTANCE
(ALSO FONT COLOR, SIZE, & TYPE) (INCREASE OR DECREASE THE DISTANCE BETWEEN LETTERS IN WORDS)



CHANGING WORD DISTANCE
(INCREASE OR DECREASE THE DISTANCE BETWEEN WORDS)



CHANGING WORD DISTANCE
(ALSO FONT COLOR, SIZE, & TYPE) (INCREASE OR DECREASE THE DISTANCE BETWEEN WORDS)




CREATING CIRCULAR IMAGES





ROUNDED IMAGE EDGES
(BUT NOT PERFECTLY CIRCULAR)




CREATING ALTERNATING ROUNDED AND POINTED IMAGE EDGES




HORIZONTALLY INVERTING A PAGE
(NOT COMPATIBLE WITH MOST BROWSERS)




MAKING CODE BOXES
(REPLACE THE PARENTHESIS WITH GREATER/LESS THAN SIGNS)



REMOVING TROPHY BOX PSEUDO-SCROLL IN CHROME



REMOVING STATS IMAGES


REMOVING TRADES, AUCTIONS, WISHLIST, NEOMAIL, & NEOFRIEND PICTURES AND LINKS FROM USERINFO SECTION
(REPLACE THE PARENTHESIS WITH GREATER/LESS THAN SIGNS)





REMOVING HORIZONTAL GRAY BARS



REMOVING HORIZONTAL GRAY BAR IN USERINFO




REMOVING USERINFO SECTION
(REMOVING THIS SECTION IS NOT RECOMMENDED)




REMOVING COLLECTIONS




REMOVING SHOP & GALLERY




REMOVING NEOPETS
(REMOVING THIS SECTION IS NOT RECOMMENDED)




REMOVING NEOHOME




REMOVING GAMES & TROPHIES




REMOVING HABITARIUM




REMOVING NC MALL INFO




REMOVING "USERLOOKUP: GUEST (?)"
(THIS CODE MAY AFFECT PERSONAL IMAGES; NEOMAIL ME FOR A QUICK FIX)



REMOVING BRODERS FROM STAT BOXES


REMOVING ALL STAT HEADERS FROM USERLOOKUP
(SEE STAT HEADERS SECTION FOR INDIVIDUAL REMOVAL CODES)


REMOVING ALL INFORMATION FROM USERLOOKUP
(REMOVING THIS INFORMATION IS NOT RECOMMENDED)



REMOVING STATS IMAGES



ADJUSTING THE SIZE OF YOUR SHIELD IMAGE




ADJUSTING THE SIZE OF YOUR TRADES, AUCTIONS, WISHLIST, NEOMAIL, & NEOFRIEND IMAGES



ADJUSTING THE SIZE OF YOUR SHOP KEEPER IMAGE



ADJUSTING THE SIZE OF YOUR COLLECTION IMAGES



ADJUSTING THE SIZE OF YOUR NEOPETS' IMAGES



ADJUSTING THE SIZE OF YOUR TROPHY IMAGES



DASHED IMAGE BORDERS - STAT IMAGES



CHANGING THE COLORS OF YOUR IMAGE BORDERS - STAT IMAGES




CREATING CIRCULAR NEOPET IMAGES




REMOVING STAT HEADERS FROM USERLOOKUP



REMOVING USERINFO HEADER FROM USERLOOKUP



REMOVING COLLECTIONS HEADER FROM USERLOOKUP



REMOVING SHOP & GALLERY HEADER FROM USERLOOKUP



REMOVING NEOPETS' HEADER FROM USERLOOKUP



REMOVING HABITARIUM HEADER FROM USERLOOKUP



REMOVING NEOHOME HEADER FROM USERLOOKUP



REMOVING TROPHIES HEADER FROM USERLOOKUP




MODIFYING HEADERS
(ALSO FONT COLOR, SIZE, FACE, & BACKGROUND COLOR)




MODIFYING HEADERS WITH NO BACKGROUND COLOR
(ALSO FONT COLOR, SIZE, & FACE)




MODIFYING HEADERS WITH UPPERCASE LETTERS
(ALSO FONT COLOR, SIZE, FACE, & BACKGROUND COLOR)




UNDERLINING HEADERS
(ALSO FONT COLOR, SIZE, FACE, & BACKGROUND COLOR)



REMOVING BORDERS FROM STAT BOXES



ADJUSTING THE SIZE OF YOUR USERINFO BOX




ADJUSTING THE SIZE OF YOUR USERINFO BOX
(NO BORDERS)



ADJUSTING THE SIZE OF YOUR COLLECTIONS BOX




ADJUSTING THE SIZE OF YOUR COLLECTIONS BOX
(NO BORDERS)



ADJUSTING THE SIZE OF YOUR SHOP BOX




ADJUSTING THE SIZE OF YOUR SHOP BOX
(NO BORDERS)



ADJUSTING THE SIZE OF YOUR NEOPETS BOX




ADJUSTING THE SIZE OF YOUR NEOPETS BOX
(NO BORDERS)



ADJUSTING THE SIZE OF YOUR NEOHOME BOX




ADJUSTING THE SIZE OF YOUR NEOHOME BOX
(NO BORDERS)



ADJUSTING THE SIZE OF YOUR TROPHIES BOX




ADJUSTING THE SIZE OF YOUR TROPHIES BOX
(NO BORDERS)



CHANGING YOUR STATS BOXES BACKGROUND COLOR




CHANGING YOUR STATS BOXES BACKGROUND IMAGE




CHANGING YOUR STAT BOXES BORDER COLORS




STAT BOXES WITH DASHED BORDERS



ADJUSTING THE SIZE OF YOUR TROPHY FONT
(FONT FACE ALSO)



MAKING YOUR PETS' NAMES LOWERCASE




CAPITALIZING YOUR PETS' NAMES



CAPITALIZING THE FIRST LETTER OF YOUR PETS' NAMES




CENTERING USERINFO TEXT


MOVING STAT BOXES CLOSER TOGETHER
(SHRINK IMAGES, TEXT, AND REMOVE BORDERS FOR SMALLER WIDTHS)



REMOVING YOUR GUILD LOGO



REMOVING THE POLL BACKGROUND COLOR IN MOZILLA





REMOVING BLACK 'ADVERTISEMENT' BAR



REMOVING GRAY BAND/UPPER PORTION OF HEADERS
(BEST USED WITH THE 'ADVERTISEMENT' BAR REMOVAL CODE)






REMOVING SIDEBAR
(CHANGE FONT COLOR TO THE COLOR OF YOUR BACKGROUND)






REMOVING SIDEBAR WITH LEFT ALIGNMENT FIX
(CHANGE FONT COLOR TO THE COLOR OF YOUR BACKGROUND)




REMOVING HEADER & FOOTER IMAGES






REMOVING ADS




REMOVING THE BANNER AT THE TOP OF THE PAGE


REMOVING THE COPYRIGHT AT THE BOTTOM OF THE PAGE
(IT IS SUGGESTED THAT YOU REPLACE THIS IF REMOVED)


CHANGING THE FONT SIZE, TYPE, & COLOR OF NEOPETS COPYRIGHT
(TEXT & LINKS SAME COLOR)



CHANGING THE FONT SIZE, TYPE, & COLOR OF NEOPETS COPYRIGHT
(TEXT & LINKS DIFFERENT COLORS)








REMOVING 'OWNER' AND QUICK PERSONALITY DESCRIPTION INFORMATION
(UPPER BLOCK OF STATISTICS MODULE)



REMOVING 'NEOMAIL OWNER' AND 'VISIT PETS WEB PAGE' IMAGES
(MAY AFFECT PERSONAL IMAGES; NEOMAIL ME FOR HELP WITH THIS)






REPLACING 'NEOMAIL OWNER' & 'VISIT PETS WEB PAGE' IMAGES
(MUST USE THE SAME IMAGE TO REPLACE BOTH IMAGES; MAY EXCEED LAYOUT DIMENSIONS)



BORDERING YOUR PETPET IMAGE



CHANGING THE SIZE OF YOUR PET'S IMAGE



CAPITALIZING PET & PETPET NAMES IN NEOPET MODULE



CAPITALIZING PET & PETPET NAMES IN NEOPET MODULE
(ALTERNATIVE CODE)




REMOVING "PET NAME THE PET TYPE (?)"




CAPITALIZING ALL LETTERS IN "PET NAME THE PET TYPE (?)"



CAPITALIZING THE FIRST LETTERS IN "PET NAME THE PET TYPE (?)"



ADDING IMAGES



IMAGE POSITIONED TO THE LEFT WITH A TEXT WRAP AROUND IT



IMAGE POSITIONED TO THE RIGHT WITH A TEXT WRAP AROUND IT



ADDING LINKS



ADDING IMAGE LINKS



IMAGE LINK WITH NO BORDER



BASIC CENTERING



PARAGRAPH CENTERING



ALIGNING TEXT TO THE LEFT



ALIGNING TEXT TO THE RIGHT



BOLDING



SLASHING TEXT
(REPLACE THE PARENTHESIS WITH GREATER/LESS THAN SIGNS)



SLASHING TEXT ON PETPAGES



UNDERLINING TEXT
(REPLACE THE PARENTHESIS WITH GREATER/LESS THAN SIGNS)



ITALICIZING TEXT



SUP TEXT



SUB TEXT



FONT COLOR



FONT SIZE



MAKING TEXT APPEAR WHEN YOU HOVER OVER AN IMAGE



BREAKING" OR ADDING TEXT TO A NEW LINE



ADDING BULLET POINTS





Heads Up! You're about to leave Neopia!

You've clicked on a link that will take you outside of
Neopets.com. We do not control your destination's website,
so its rules, regulations, and Meepit defense systems will be
different! Are you sure you'd like to continue?



It is a journey
I must face...alone.
*dramatic music*
I want to stay on Neopets,
where the dangers of
Meepit invasion
are taken seriously.
Heads Up! You're about to leave Neopia!

You've clicked on a link that will take you outside of
Neopets.com. We do not control your destination's website,
so its rules, regulations, and Meepit defense systems will be
different! Are you sure you'd like to continue?



It is a journey
I must face...alone.
*dramatic music*
I want to stay on Neopets,
where the dangers of
Meepit invasion
are taken seriously.
Heads Up! You're about to leave Neopia!

You've clicked on a link that will take you outside of
Neopets.com. We do not control your destination's website,
so its rules, regulations, and Meepit defense systems will be
different! Are you sure you'd like to continue?



It is a journey
I must face...alone.
*dramatic music*
I want to stay on Neopets,
where the dangers of
Meepit invasion
are taken seriously.
/help/bumper/headers/log-in-to-facebook

NEOPETS, characters, logos, names and all related indicia
are trademarks of Neopets, Inc., © 1999-2014.
® denotes Reg. US Pat. & TM Office. All rights reserved.

PRIVACY POLICY | Safety Tips | Contact Us | About Us | Press Kit
Use of this site signifies your acceptance of the Terms and Conditions