javascript - Hiding a row in table using ngAnimate -

i'm trying hide row in table has content. i'm facing few issues..

1) after height set 0 border still shows up. how hide whole div ?

2) since there colspan="5" content when it's hidden table width shrinks

<table>  <tr>     <td class="item0">test td 1</td>     <td class="item1">test td 2</td>     <td class="item2">test td 3</td>     <td class="item3">test td 4</td>     <td class="item4">click content</td>      </tr> <tr>     <td  colspan="5">         <div ng-hide="show" class="cssslideup">           lorem ipsum dolor sit amet, consectetur adipiscing elit. integer pulvinar nisi sit amet luctus efficitur. vivamus eu risus suscipit, ultricies tortor eu, sodales tellus. sed sed feugiat massa. cras mollis, erat eget pellentesque porttitor, mauris lectus ultricies neque, varius iaculis quam mi et quam. interdum et malesuada fames ac ante ipsum primis in faucibus. nunc egestas nec mi eu lobortis. nam eu scelerisque orci. mauris vel ultricies dui, non accumsan turpis. aliquam pulvinar in dolor sit amet fringilla. integer sed quam pellentesque, volutpat arcu a, feugiat nisi. pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. sed auctor ac nulla sit amet suscipit.         </div>     </td> </tr> <tr>     <td class="item0">test td 5</td>     <td class="item1">test td 6</td>     <td class="item2">test td 7</td>     <td class="item3">test td 8</td>     <td class="item4">click content</td>      </tr> </table> 

plnkr : http://plnkr.co/edit/4ovuz7ywob3i8bk7wllz?p=preview

you hiding whole div.

the problem you've set border on td. parent element of div you're hiding, why border remains.

if want table have same width, you'll need set width. e.g. add css:

table{width:100%;}