Dorababu Meka

Dorababu Meka

  • 226
  • 8.3k
  • 1.7m

Why empty space is showing when a div visibilty is false

Jun 24 2011 4:32 AM
Hi all i am having 2 check boxes and 2 div's on my web page. On checking particular check box i will show the corresponding div to the user but if i show second div the space which was occupied by first div is occupying empty space why it is happening
 
Assume my structure is as follows

<div id="div1" runat="server"> <div> </div>  </div>

<div id="div2" runat="server"> <div> </div> </div>  

<asp:checkbox id="chk1" runat="server" text="Show Div1" autopostback=true />  

<asp:checkbox id="chk2" runat="server" text="Show Div2" autopostback=true />  
in code i am showing as follows for both the check boxes
 

if (chk1.Checked) { div1.Visible = true; } else { div1.Visible = false; }

if (chk2.Checked) { div2.Visible = true; } else { div2.Visible = false; }  

Can any one tell how to resolve this
 
Sample Style applied for Div is as follows
 

.style1 { width: 268px; height: 19px; position: absolute; top: 16px; left: 335px; float: left; z-index: 1; }

Answers (5)