Visibility
If you're reading this you now have some idea what visibility is and what you can do with it. It's not only for cheap tricks like I've used here but for things like drop down navigation and pop up ads and the like. Basically any content that you want to appear/disappear when a certain event occurs needs the visibility property and javascript to work.
However, if your visitors have javascript disabled then your nifty effects won't work. So if you clicked the button above and nothing happened, you probably need to enable javascript. Of course if nothing happened, then you aren't reading this to know you have to enable JavaScript to read this. Nice little catch 22 I've created here.
visibility:hidden;
}
.showIt {
visibility:visible;
}
Above you can see CSS style declarations showing the two most supported values you have for the visibility property. Pretty simple, huh? One important thing to note with visibility is that it only hides what you make invisible. The space for it is still there. This is important if you want to retain the structure of your page and only make certain parts disappear/appear. You'll understand this better when you get to the printing section. For now, if you would like to see another use for visibility that's an ink saver in printing, then just print preview this page and see what you don't have to print.
That's all fine and good IF you want the space retained for the unseen elements, but what if you don't want the space to remain? Maybe you need the other elements to fill in where the hidden items are. In this case we use the display:none; property and value. "display" doesn't save the space of the elements being hidden. It also has many other values beside what we are using here. Things such as display:inline; OR display:block; which are used to display block elements as inline and inline elements as block respectively. They are for the more advanced CSS coder but feel free to play with them if you want. For our purposes here we are only interested with the "none" value of it here.
With that all said, lets move on to the next section on clipping.