Here, there are no gaps between columns/cells in both table header and table body. I need space between column in table head but there should be no gaps between columns in table body. 

How to include space between columns in `thead` alone. i.e border space?

Below is the code I have tried. 

[jsfiddle](https://jsfiddle.net/arunachalam408/81phjw9x/1/)

```css
table.OrderDetail {
    font-family: Arial;
    border-collapse: collapse;
}
.OrderDetail tbody {
    padding: 10px;
    text-align: left;
    font-size:13px;
    font-family: Arial;
}
.OrderDetail thead {
    padding: 7px;
    text-align: left;
    background-color: #E0E0E0;
    color:#989898;
    font-size:10px;
}
.OrderNumber {
    font-family: Helvetica, Arial, sans-serif;
    background-color: #99CCFF;
    text-align: left;
}
.OrderNumber thead {
    font-size:10px;
}
.OrderNumber tbody {
    font-size:15px;
}
tr.separating_line td {
    border-bottom: 1px solid gray; /* set border style for separated rows */
}
.OrderDetail td {
    padding: 10px 0; /* 10px top & bottom padding, 0px left & right */
}
.OrderDetail th {
    padding: 5px 0; /* 10px top & bottom padding, 0px left & right */
}
```

```html
<table class="OrderNumber" style="width:100%">
    <thead>
        <tr></tr>
        <tr>
            <td>Order Number</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>234456667</td>
        </tr>
        <tr></tr>
    </tbody>
</table>
<br></br>
<table class="OrderDetail" style="width:100%">
    <thead>
        <tr>
            <th>Line Item Number</th>
            <th>Item Description</th>
            <th>Ship To Location</th>
            <th>Carrier</th>
            <th>Tracking Number</th>
        </tr>
    </thead>
    <tbody>
        <tr class="separating_line">
            <td>1</td>
            <td>$itemDescription</td>
            <td>$shipToLocation</td>
            <td>$carrier</td>
            <td style="color:#33CCFF">$trackingNumber</td>
        </tr>
        <tr class="separating_line">
            <td>1</td>
            <td>$itemDescription</td>
            <td>$shipToLocation</td>
            <td>$carrier</td>
            <td style="color:#33CCFF">$trackingNumber</td>
        </tr>
    </tbody>
</table>
```

I have used border-collapse: collapse at table. This makes all border continuos. I need it be continuos at body and not continuos at head level of table. is it even possible?