Html 表格左边框太粗，背景 colored颜色 未填充在边框半径内

table {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  width: 100%;
  background-color: #ffffff;
  border-collapse: separate;
  border-spacing: 0;
}
table tr th,
table tr td {
  border-right: 2px solid #dedede;
  border-bottom: 2px solid #dedede;
  padding: 10px;
}

table tr th:first-child,
table tr td:first-child {
  border-left: 2px solid #dedede;
}
table tr th:first-child,
table tr td:first-child {
  border-left: 2px solid #dedede;
}
table tr th {
  background: #eee;
  text-align: left;
  border-top: solid 2px #dedede;
}

table td:last-child {
  background-color: #edf2f4;
}

/* top-left border-radius */
table tr:first-child th:first-child {
  border-top-left-radius: 10px;
}

/* top-right border-radius */
table tr:first-child th:last-child {
  border-top-right-radius: 10px;
}

/* bottom-left border-radius */
table tr:last-child td:first-child {
  border-bottom-left-radius: 10px;
}

/* bottom-right border-radius */
table tr:last-child td:last-child {
  border-bottom-right-radius: 10px;
}

<div>
    <table>
        <tr>
            <th>item1</th>
            <th>item2</th>
        </tr>
        <tr>
            <td>item1</td>
            <td>item2</td>
        </tr>
        <tr>
            <td>item1</td>
            <td>item2</td>
        </tr>
        <tr>
            <td>item1</td>
            <td>item2</td>
        </tr>
    </table>
</div>