Как уменьшить высоту строки таблицы

Question

У меня есть таблица с несколькими строками. Я пытаюсь так много способов с CSS. Остановка CSS работает на высоте: 10 пикселей, как я должен делать. Пожалуйста, покажите мне правильное направление. Может кто-нибудь сказать, пожалуйста, как это сделать?

 #gridview {
        font-family: arial, sans-serif;
        border-collapse: collapse;
        width: 100%;
    }
 #gridview th {
        background-color: #808080;
        border: 1px solid #dddddd;
       text-align: center;
       padding: 0px 0px 0px 0px;
        margin:0px;
        height: 0px;
    }

#gridview td {
        border: 0px solid #dddddd;
        text-align: left;
       padding: 0px 0px 0px 0px;
        margin:0px;
        height: 0px;
    }

 #gridview tr:nth-child(even) {
        background-color: #dddddd;
    }
#gridview table th {
        color:#ffffff;
    }
</style>
<table id="gridview">
        <tr>
             <th><h5>SrNo</h5> </th>
             <th><h5>Stock No</h5></th>
             <th><h5>Stock Name</h5></th>
             <th><h5>UM</h5></th>
             <th><h5>Balance</h5></th>
             <th><h5>Purchase</h5></th>
             <th><h5>Quantity</h5> </th>
             <th><h5>Amount</h5></th>
             <th></th>
        </tr>
        <tr>
             <td><p>SrNo</p> </td>
             <td><p>Stock No</p></td>
             <td><p>Stock Name</p></td>
             <td><p>UM</p></td>
             <td><p>Balance</p></td>
             <td><p>Purchase</p></td>
             <td><p>Quantity</p> </td>
             <td><p>Amount</p></td>
        </tr>
 </table>

Answer 1

Ошибка в ваших p элементах была проблемой. Снятие его привело к уменьшению высоты.

#gridview {
        font-family: arial, sans-serif;
        border-collapse: collapse;
        width: 100%;
    }
 #gridview th {
        background-color: #808080;
        border: 1px solid #dddddd;
       text-align: center;
       padding: 0px 0px 0px 0px;
        margin:0px;
        height: 0px;
    }

#gridview td {
        border: 0px solid #dddddd;
        text-align: left;
       padding: 0px 0px 0px 0px;
        margin:0px;
        height: 0px;
    }

 #gridview tr:nth-child(even) {
        background-color: #dddddd;
    }
#gridview table th {
        color:#ffffff;
    }
   table p
    {
      padding:0px;
      margin:0px;
    }

<table id="gridview">
                <tr>
                    <th><h5>SrNo</h5> </th>
                    <th><h5>Stock No</h5></th>
                    <th><h5>Stock Name</h5></th>
                    <th><h5>UM</h5></th>
                    <th><h5>Balance</h5></th>
                    <th><h5>Purchase</h5></th>
                    <th><h5>Quantity</h5> </th>
                    <th><h5>Amount</h5></th>
                    <th></th>
                </tr>
                <tr>
                    <td><p>SrNo</p> </td>
                    <td><p>Stock No</p></td>
                    <td><p>Stock Name</p></td>
                    <td><p>UM</p></td>
                    <td><p>Balance</p></td>
                    <td><p>Purchase</p></td>
                    <td><p>Quantity</p> </td>
                    <td><p>Amount</p></td>
                </tr>
            </table>

Надеюсь, это то, что вам нужно.