Как создать следующую таблицу дизайна

Question

Как выполнить дизайн таблицы, как показано ниже?Чего я хочу добиться, так это прикрепленного изображения, и я пытаюсь удалить границу с правой стороны таблицы и нижней стороны последней строки.

@import url('https://fonts.googleapis.com/css?family=Merriweather:300,300i,400,400i,700,700i,900,900i|Rubik:300,300i,400,400i,500,500i,700,700i,900,900i');
            .data-table { font-size: 15px; line-height: 28px; font-family: Rubik,sans-serif; font-weight: 400;  text-align: left; max-width: 1200px; margin: 0 auto; border: 2px solid #ECEEF0; border-radius: 4px; }
            .data-table th, .data-table td { padding: 5px; border-bottom: 2px solid #ECEEF0; border-right: 2px solid #ECEEF0; margin: 0; vertical-align: top; }
            .data-table tr td:first-child { width: 35%; }
            .data-table tr td:nth-child(2n) { width: 15%; }
            .data-table tr td:nth-child(3n) { width: 50%; }

<table class="data-table" cellpadding="0" cellspacing="0" border="0">
                <thead>
                    <tr>
                        <th>Purposeactivity</th>
                        <th>Type of data</th>
                        <th>Lawful basis of proccesing including basis of legimate interest</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</td>
                        <td>a) Lorem Ipsum, b) Lorem Ipsum</td>
                        <td>Lorem Ipsum is simply dummy text of the printing</td>
                    </tr>
                    <tr>
                        <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</td>
                        <td>a) Lorem Ipsum, b) Lorem Ipsum, c) Lorem Ipsum, d) Lorem Ipsum, e) Lorem Ipsum, f) Lorem Ipsum</td>
                        <td>a) Lorem Ipsum is simply dummy, b) Lorem Ipsum is simply dummy</td>
                    </tr>
                    <tr>
                        <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has</td>
                        <td>a) Lorem Ipsum, b) Lorem Ipsum, c) Lorem Ipsum</td>
                        <td>a) Lorem Ipsum is simply printing and typesetting dummy, b) Lorem Ipsum printing and typesetting is simply dummy</td>
                    </tr>
                </tbody>
            </table>

Answer 1

Используя эту CSS, вы можете удалить границу справа и снизу

            .data-table,.data-table th:last-child,.data-table td:last-child{
                border-right:0px;}
            .data-table,.data-table tr:last-child td{
                border-bottom:0px;}

@import url('https://fonts.googleapis.com/css?family=Merriweather:300,300i,400,400i,700,700i,900,900i|Rubik:300,300i,400,400i,500,500i,700,700i,900,900i');
            .data-table { font-size: 15px; line-height: 28px; font-family: Rubik,sans-serif; font-weight: 400;  text-align: left; max-width: 1200px; margin: 0 auto; border: 2px solid #ECEEF0; border-radius: 4px; }
            .data-table th, .data-table td { padding: 5px; border-bottom: 2px solid #ECEEF0; border-right: 2px solid #ECEEF0; margin: 0; vertical-align: top; }
            .data-table tr td:first-child { width: 35%; }
            .data-table tr td:nth-child(2n) { width: 15%; }
            .data-table tr td:nth-child(3n) { width: 50%; }
            .data-table,.data-table th:last-child,.data-table td:last-child{
            border-right:0px;}
            .data-table,.data-table tr:last-child td{
            border-bottom:0px;}

<table class="data-table" cellpadding="0" cellspacing="0" border="0">
                <thead>
                    <tr>
                        <th>Purposeactivity</th>
                        <th>Type of data</th>
                        <th>Lawful basis of proccesing including basis of legimate interest</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</td>
                        <td>a) Lorem Ipsum, b) Lorem Ipsum</td>
                        <td>Lorem Ipsum is simply dummy text of the printing</td>
                    </tr>
                    <tr>
                        <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</td>
                        <td>a) Lorem Ipsum, b) Lorem Ipsum, c) Lorem Ipsum, d) Lorem Ipsum, e) Lorem Ipsum, f) Lorem Ipsum</td>
                        <td>a) Lorem Ipsum is simply dummy, b) Lorem Ipsum is simply dummy</td>
                    </tr>
                    <tr>
                        <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has</td>
                        <td>a) Lorem Ipsum, b) Lorem Ipsum, c) Lorem Ipsum</td>
                        <td>a) Lorem Ipsum is simply printing and typesetting dummy, b) Lorem Ipsum printing and typesetting is simply dummy</td>
                    </tr>
                </tbody>
            </table>