[RESOLVED] hiding element

I have a table enclosed in <div> tag. With a click of button, the hidden attribute toggles between hidden and visible.

Code:

---

document.getElementById(a).style.visibility = "hidden";

---

Code:

---

document.getElementById(a).style.visibility = "visible";

---

Hiding and displaying works well, but when the element is hidden, there is still large blank area that is visible. By hiding the element, I want to gain that space too.

Using height property is not helping.

Code:

---

document.getElementById(a).style.height = 0+"px";

---

Is there any way I can gain that space when an element is hidden?

Change the display to none and back to block.

Also read about the differences of visibility and display from CSS Property Index

"display" is set to "block" by default which means no matter what the "visibility" is set to, it will always be "display:block;", which means otherwise it will always be there, so you need to change it like Merri says.

Code:

---

document.getElementById(a).style.display = "none";

---

Code:

---

document.getElementById(a).style.display = "block";

---

:check:Thanks both of you, it worked.

sridharao, if you do not mark the threads as resolved, people wont see that you have gotten the help needed to complete what you're attempting to do, so please mark your threads as resolved when your question(s) have been answered properly/correctly.

if you do not know how, then visit this link: http://www.vbforums.com/showthread.php?t=551337