1
Answer

How stop the overlapping of the html table

i have a table with two rows and three td's .in first row i have three images.and in second row i have a one image.after i given id and runat="server" for one td because every td has a image button.in that td image i want to display based on the condition.for that if the condition is true i give the property (td id) .visible=false; after that my table becoming as table with two rows only.that is it is showing two images in one row .and one image in another row.i want it like whenever we hide the image the next image has to replace that place.please help  me...

Attachment: table.zip

Answers (1)
0
Madhanmohan Devarajan

Madhanmohan Devarajan

NA 6.5k 471.2k 7y
In your case you need to change the colspan=2 or 3 when you are hiding the other two or one TD(s).
 
<table>
 <tr id="row1">
    <td ><img src=""/></td> <td><img src=""/></td> <td><img src=""/></td>
 </tr>
 
<tr id="row2">
<td id="col1"><img src=""/></td> <td id="col2"><img src=""/></td> <td id="col3"><img src=""/></td>
</tr>
 
</table> 
 
You can also assign the column span from C# coding.
 
To change the column span using javascript:
JavaScript syntax:
object.style.columnSpan="all"
 
document.getElementById("col1").style.columnSpan="all"; or document.getElementById("col1").style.columnSpan=2; (If you are hiding only one column)