Reputation: 33
I have table with few rows. I try so many way with css. css stop worked at height:10px;how should i do.Please show me right direction. Could anyone please tell me how to do it?
#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>
Upvotes: 0
Views: 4810
Reputation: 694
The margin in your p elements was the problem. Removing it made the height reduce.
#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>
Hopefully, this is what you need.
Upvotes: 1