My control inside the <div> tag is overlapping with the next row of the table.

I have a textarea control with id "txtNameAddressThirdParty" which  is put under a <div> tag. This div is going to be displayed dynamically when the user chooses yes in the radio button list. But, when the div get displayed, it overlaps with the next row element of my table.

This problem is happening in firefox.

Here is my css:

.container
{
      position: relative;      
      width: auto;
      height: auto;
      margin: 0 auto;      

      }


Here is my html code:

<table>
<TR>
      <TD colSpan="3">
      <DIV id="lblUseThirdParty" class="container" runat="server">                              Name/Address&nbsp;                                                      <TEXTAREA onkeypress="return imposeMaxLength(this,512);" id="txtNameAddressThirdParty" style="Z-INDEX: 101; LEFT: 2px; WIDTH: 737px; POSITION: absolute; TOP: 17px; HEIGHT: 29px"
tabIndex="326" name="txtNameAddressThirdParty" rows="1" cols="96" runat="server"></TEXTAREA>
</DIV>
</TD>
</TR>
<TR>
<TD colSpan="3">Software used for storing, transmitting or processing Card
Transaction or Authorization requests<BR>
<TEXTAREA onkeypress="return imposeMaxLength(this,199);" id="txtSoftwareUsed" style="WIDTH: 737px; HEIGHT: 29px"
                                                                                                            tabIndex="327" name="txtSoftwareUsed" rows="1" cols="95" runat="server"></TEXTAREA>
                                                                                                </TD>
                                                                                          </TR>
</table>

This problem is happening in many areas of my web page since it has more dynamicity in it.

Is the problem in the css settings?

Thanks in advance.
chaleastaleAsked:
Who is Participating?
 
ch2Commented:
Or delete the POSITION: absolute;
0
 
ch2Commented:
In the first <TEXTAREA change the POSITION to relative.
0
 
chaleastaleAuthor Commented:
And the above problem is happening only in firefox. IE works fine.
0
 
sehhorngCommented:
You are using Position Option which causes the DIV to float. Therefore the table will appear overlapping the div.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.