html - 純粋な css テーブルのスタイリング

Question

いくつかの Web ページをデザインしていて、特定のテーブル スタイルに出会いました。このテーブルは静的テーブルになります。しかし、css を使用して与えられたスタイルを複製することはできません。各セルで高さ、幅のプロパティを使用してみましたが、テーブル全体のサイズが変更されました。誰かがこのタイプの出力を取得する方法を知っている場合は、私を助けてください..グーグルで試してみましたが、良いチュートリアルはありませんでした.

例 ：

table{
                border-collapse: separate;
                border-spacing: 4px;
                margin: 26px auto;
            }
            .header-cell{
                width: 107px;
                height: 66px;
                text-align: center;
                background-color: #788fc9;
                margin: 1.5px;
                font-family: verdana;
                font-size: 18px;
                font-weight: bold;
                text-shadow: 0px 0px 4px white;
                display: table-cell;
                vertical-align: middle;
            }
            .data-cell{
                width: 107px;
                height: 66px;
                background-color: #6376a7;
                text-align: center;
                font-family: verdana;
                font-size: 18px;
                font-weight: bold;
                display: table-cell;
                vertical-align: middle;
                color: #FFFFFF;
            }


<table class="wireless-table">
                            <tbody>
                                <tr>
                                    <td class="header-cell">PLAN</td>
                                    <td class="header-cell">PRICE</td>
                                    <td class="header-cell">MONTHLY</td>
                                </tr>
                                <tr>
                                    <td class="header-cell">250MB</td>
                                    <td class="data-cell">$10</td>
                                    <td class="data-cell">$0.05/MB</td>
                                </tr>
                                <tr>
                                    <td class="header-cell">500MB</td>
                                    <td class="data-cell">$20</td>
                                    <td class="data-cell">$0.05/MB</td>
                                </tr>
                                <tr>
                                    <td class="header-cell">1GB</td>
                                    <td class="data-cell">$30</td>
                                    <td class="data-cell">$0.05/MB</td>
                                </tr>
                                <tr>
                                    <td class="header-cell">2GB</td>
                                    <td class="data-cell">$40</td>
                                    <td class="data-cell">$0.05/MB</td>
                                </tr>
                                <tr>
                                    <td class="header-cell">3GB</td>
                                    <td class="data-cell">$50</td>
                                    <td class="data-cell">$0.05/MB</td>
                                </tr>
                            </tbody>
                        </table>

フィデルはここで見つけることができます！