Alongside Ajax (see previous article), one of the weapons in the web developer's arsenal for combating a stodgy user interface is the ability to hide and show HTML elements.

There are two basic ways to hide and show elements in css: one uses the "display" property:

#myHiddenDiv
{
  display:none;
}

#myVisibleDiv
{
  display:block;
}

And the other uses the "visibility" property: 

#myHiddenDiv
{
  visibility:hidden;
}

#myVisibleDiv
{
  visibiity:visible;
}

The display:none property acts as if the element never existed - i.e. the element takes up no space on the screen - while the 'visibility: hidden' property leaves a gap where the element should be visible.

If you're using jQuery to make something appear and disappear, you can use hide and show methods - your code should look something like this:

$('#myHiddenDiv').show();

NB. If you want to make something dynamically appear and it's overlapping other elements when you don't want it to - try making it display normally first in order to troubleshoot. It may be that it has a parent which has relative positioning.