HTML/CSS codes
On this page there will be useful codes that I get asked about a lot. You'll need to have some CSS and HTML knowledge to understand how to use them.OTHER HELP SITES - CSShelp's pet page, NeoExtreme's blog coder, Kitxoone's hover-code.
This page will often ask you to put code into CSS. To do this, just make sure that what's in the text box is somewhere between <style> and </style> tags on your page. For more help on how this works, read the CSS tip at the bottom of the page!
Petpage codes
To get rid of the "NEOPETS, characters, logos, names..." part at the bottom of your pet page, add this following code in your CSS.
To get rid of the Neo bar at the top of your pet page, add this following code in your CSS. MAKE SURE that you have a <div> somewhere at the top of your code (at the very, very beginning of everything will do) or else other things might disappear that you don't want to!
Big CSS tip!
A lot of people using CSS now days don't realize how much they can cut down on the size of the code. There are a lot of unnecessary pieces of code that can be easily fixed, and I'm going to give you tips on how to recognize when you're using way more characters than you need to!
When you copy and paste a bunch of different CSS tricks into your page from CSS help, your code will often look like this:
Now, this is a small section of code, and it doesn't necessarily do anything desirable, but we'll use it as an example. I just copied and pasted a few various sections from CSShelp's page.
Notice how many times throughout the code you see <style> and </style> repeated? This is completely unnecessary, though I still see it from fairly knowledgeable coders!
You will never, ever need more than ONE of each of those two tags, which means that's quite a bit of extra space that doesn't need to be taken up. All you need to do is take what's inside of those tags, and put them all together. Make sure that all of the CSS still has a <style> to start it, and a </style> to end it, though. Here's an example, using the same code as above:
Ah, much better, and easier to read, right? But wait, that's not all! Notice how we have two sections of code that start with body? And three that end in {display:none}? These are two other places where we can shorten our code, and make it a lot easier to manage. One simple rule in CSS is that within the {} brackets, you can separate different parts of code with a semicolon (;).
We can take all the code within the brackets from one of those bracketed areas that start with body, and we can move it within the other brackets starting with body, which would look like this: body{} body{background:url(http://images.neopets.com/backgrounds/tile4.gif) fixed; background:cyan}. Now, you can get rid of that little empty body{} part, as it doesn't do anything anymore.
Now, our little .sf and #m,#n,#mb,#ol can both be merged on to the beginning of the first {display:none}. You can separate parts before the brackets with commas. We merge these like this: #m,#n,#mb,#ol,.sf,center font b,#n,hr,#ban{display:none}. Notice that you see #n twice? Go ahead and get rid of one of them - it doesn't matter which. Here is what all of our code should look like now:
Ah, there we are. Nice, easy to read, organized code - and without taking up extra space for your character limit! Hopefully this was useful and easy to understand. If you have any confusions, feel free to contact me through neomail.