Forums - C# Corner

Forum guidelines
Priyanka Singh

Priyanka Singh

  • 1.4k
  • 420
  • 8.9k

I have to display table on "read more" content

Jan 11 2019 1:24 AM
I have to design "read more" and "read less" button on page to read more content but I have to display table inside "read more" content.
 
I have code
  1. <div>  
  2.   <input type="checkbox" class="read-more-state" id="post-1" />  
  3.   
  4.   <p class="read-more-wrap"><div class="table">  
  5.         <table width="680" border="1" cellpadding="0" cellspacing="0">  
  6.             <tbody>  
  7.                 <tr>  
  8.                     <th valign="top" style="width: 150px;" align="left">  
  9.                         Particulars  
  10.                     </th>  
  11.                     <th valign="top" style="width: 150px" align="left">  
  12.                         Disclosures  
  13.                     </th>  
  14.                 </tr>  
  15.                 <tr>  
  16.                     <td align="left" valign="top">  
  17.                         Date of Appointment & term of appointment  
  18.                     </td>  
  19.                     <td align="left" valign="top">  
  20.                         W.e.f.01st October, 2018, 5 years  
  21.                     </td>  
  22.                 </tr>  
  23.                 <tr>  
  24.                     <td align="left" valign="top">  
  25.                         Date of Birth and Age  
  26.                     </td>  
  27.                     <td align="left" valign="top">  
  28.                         10th February, 1962, 56 years.  
  29.                     </td>  
  30.                 </tr>  
  31.                 <tr>  
  32.                     <td align="left" valign="top">  
  33.                         Qualification  
  34.                     </td>  
  35.                     <td align="left" valign="top">  
  36.                         B.Com.  
  37.                     </td>  
  38.                 </tr>  
  39.                 <tr>  
  40.                     <td align="left" valign="top">  
  41.                         Date of first appointment  
  42.                     </td>  
  43.                     <td align="left" valign="top">  
  44.                         02nd June, 1992  
  45.                     </td>  
  46.                 </tr>  
  47.                 <tr>  
  48.                     <td align="left" valign="top">  
  49.                         Shareholding in the Company  
  50.                     </td>  
  51.                     <td align="left" valign="top">  
  52.                         18,57,485 Ordinary Equity Shares and 92,873 DVR Equity Shares  
  53.                     </td>  
  54.                 </tr>  
  55.                 <tr>  
  56.                     <td align="left" valign="top">  
  57.                         Disclosure of relationships between Directors  
  58.                     </td>  
  59.                     <td align="left" valign="top">  
  60.                         Shri Ashok B. Jain, Shri Anil B. Jain, Shri Ajit B. Jain and Shri Atul B. Jain are  
  61.                         brothers and related to each other.  
  62.                     </td>  
  63.                 </tr>  
  64.             </tbody>  
  65.         </table>  
  66.     </div></span></p>  
  67.     
  68.   <label for="post-1" class="read-more-trigger"></label>  
  69. </div>  
  70.   
  71. <div>  
  72.   <input type="checkbox" class="read-more-state" id="post-2" />  
  73.   
  74.   <ul class="read-more-wrap">  
  75.     <li>lorem</li>  
  76.     <li>lorem 2</li>  
  77.     <li class="read-more-target">lorem 3</li>  
  78.     <li class="read-more-target">lorem 4</li>  
  79.   </ul>  
  80.     
  81.   <label for="post-2" class="read-more-trigger"></label>  
  82. </div> 

Answers (2)