?
Solved

Div tag within a table. How?

Posted on 2003-03-26
6
Medium Priority
?
182 Views
Last Modified: 2010-04-09
How can I hide a section of a table on the fly? I try the follow and it doesn't work.
If I embed another table within it works, but cell no long align. Thanks.

<table>
<div id="1" style="display:none">
<tr>
<td>what to hide this</td>
<td>what to hide this</td>
</tr>
</div>

<tr>
<td>show</td>
<td>show</td>
</tr>
</table>
0
Comment
Question by:g6shasha
6 Comments
 

Accepted Solution

by:
jachin earned 200 total points
ID: 8214705
The most obvious way to do this is to set style="display:none" for the <TR>. This works. But you need to do it for every row that you wish to hide.
0
 
LVL 3

Expert Comment

by:Adelphi
ID: 8215823
Show/hide divs really only work well when the div marks one cell's contents....so your inner table idea is the solution.  Just set the widths on your table cells to get them to line up.

<table cellpadding="0" cellspacing="0">
<tr>
<td colspan="2">
  <div id="1" style="display:none">
  <table width="500" cellpadding="0" cellspacing="0">
  <tr>
  <td width="100">want to hide this</td>
  <td>want to hide this</td>
  </tr>
  </table>
  </div>
</td>
</tr>

<tr>
<td width="100">show</td>
<td>show</td>
</tr>
</table>
0
 
LVL 6

Expert Comment

by:mattjp88
ID: 8286474
you could just have 2 tables with <div> tags around them.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Expert Comment

by:Adam_J
ID: 8400498
I wrote the code below because I had a table and wanted to be able to expand each row to show / hide more content.  I had exactly the same problem.  Putting <div> tags around <tr> tags within a table is exactly what you want to do, but they must go within a <td> tag.

<table cellpadding="0" cellspacing="0" border="0" summary="main table">
  <tr>
    <td>content where your main row is</td>
  </tr>
  <tr>
    <td>
      <div id="abc">
         <table cellpadding="0" cellspacing="0" border="0" summary="table with your div">
           <tr>
             <td>more content which could be hidden</td>
           </tr>
         </table>
       </div>
     </td>
  </tr>
</table>
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8820617
This question has been classified abandoned. I will make a recommendation to the
moderators on its resolution in a week or two. I appreciate any comments
that would help me to make a recommendation.

<note>
Unless it is clear to me that the question has been answered I will recommend delete.  It is possible that a Grade less than A will be given if no expert makes a case for an A grade. It is assumed that any participant not responding to this request is no longer interested in its final disposition.
</note>

If the user does not know how to close the question, the options are here:
http://www.experts-exchange.com/help/closing.jsp


Cd&

0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 9016091
It is time to clean this abandoned question up.

I am putting it on a clean up list for CS.

<recommendation>
points to jachin

</recommendation>

If anyone participating in the Q disagrees with the recommendation,
please leave a comment for the mods.

Cd&

0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
Suggested Courses

621 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question