hope this helps you.
<style type="text/css">
.buttonCollapse
{
text-align: center;
border: 2px solid #007CB9;
height: 15pt;
vertical-align: middle;
cursor: pointer;
cursor: hand;
}</style>
<script type="text/jscript">
function showHideDiv()
{
var divstyle = new String();
divstyle = document.getElementById("dvDisplay").style.display;
if(divstyle.toLowerCase()=="block" || divstyle == "")
{
document.getElementById("dvDisplay").style.display = 'none';
document.getElementById("btnDisplay").value = '+';
}
else
{
document.getElementById("dvDisplay").style.display = 'block';
document.getElementById("btnDisplay").value = '-';
}
}
</script>
<body>
<form id="form1" runat="server">
<div>
<input id="btnDisplay" runat="server" type="button" class="buttonCollapse" önclick="showHideDiv()">
value="-" />
<div id="dvDisplay" runat="server" style="border-color:Black; background-color:Gray;">
Content of the division.......
</div>
</input></div>
</form>
</body>