Card header background color bug?


I dont know why when i’m change header background color with item-positive class and i got this.

If you look closely in the top left and top right of the image. You can feel like header shorter than content. How to slove this ?
this is my code
<div class="card"> <div class="item item-divider item-positive"> I'm a Header in a Card! </div> <div class="item item-text-wrap "> <table style="width:100%"> <tr> <td>Năm <i class="lunar_year"></i></td> <td>Tháng <i class="lunar_month"></i></td> </tr> <tr> <td>Ngày <i class="lunar_day"></i></td> <td>Giờ <i class="lunar_hour"></i></td> </tr> <tr> <td>Tháng <i class="lunar_month_number"></i></td> <td>Ngày <i class="lunar_day_number"></i></td> </tr> </table> </div> </div>