Удалить границу и CSS из последнего столбца таблицы

Question

Я хочу удалить border и css из последнего столбца HTML таблицы и отображения, как будто это последний столбец не является частью только table и таблица закончилась во второй последней колонке.

Фактическое требование: отображать изображение ошибки везде, где есть ошибка в строке.

Пожалуйста, найти свой код ниже я пытался:

table { 
 
    font-family: arial, sans-serif; 
 
    border-collapse: collapse; 
 
    width: 100%; 
 
} 
 
td, th { 
 
    border: 1px solid #dddddd; 
 
    text-align: left; 
 
    padding: 8px; 
 
} 
 
tr:nth-child(even) { 
 
    background-color: #dddddd; 
 
} 
 
#myTable tbody > tr:last-child > td { 
 
    border: 0; 
 
}

<table id="myTable"> 
 
    <tr> 
 
    <th>Company</th> 
 
    <th>Contact</th> 
 
    <th>Country</th> 
 
    </tr> 
 
    <tr> 
 
    <td>abc</td> 
 
    <td>ffff</td> 
 
    <td>Germany</td> 
 
    <td><img src="smiley.gif" alt="Smiley face" width="42" height="42"></img></td> 
 
    </tr> 
 
    <tr> 
 
    <td>abac</td> 
 
    <td>dddd</td> 
 
    <td>Mexico</td> 
 
    <td><img src="smiley.gif" alt="Smiley face" width="42" height="42"></img></td> 
 
    </tr> 
 
    <tr> 
 
    <td>abcd</td> 
 
    <td>fdfd</td> 
 
    <td>Austria</td> 
 
    <td><img src="smiley.gif" alt="Smiley face" width="42" height="42"></img></td> 
 
    </tr> 
 
    <tr> 
 
    <td>abcde</td> 
 
    <td>dddd</td> 
 
    <td>UK</td> 
 
    <td><img src="smiley.gif" alt="Smiley face" width="42" height="42"></img></td> 
 
    </tr> 
 
    <tr> 
 
    <td>dert</td> 
 
    <td>bbbb</td> 
 
    <td>Canada</td> 
 
    <td><img src="smiley.gif" alt="Smiley face" width="42" height="42"></img></td> 
 
    </tr> 
 
    <tr> 
 
    <td>asd</td> 
 
    <td>Giovanni Rovelli</td> 
 
    <td>Italy</td> 
 
    <td><img src="smiley.gif" alt="Smiley face" width="42" height="42"></img></td> 
 
    </tr> 
 
</table>

Answer 1

Я создал демо, Является ли это то, что вы ищете?

td:last-child { 
    border :none; 
    background-color: #ffffff; 
} 

Demo

Answer 2

Попробуйте ... отрегулировать последнюю колонку.

#myTable tbody > tr > td:last-child { 
    border: 0; 
    // any other options needed. 
} 

также, чтобы удалить другие CSS, любой CSS для td должны быть стилизовано ...

#myTable tbody > tr > td:not(:last-child) { 
    // CSS for other columns 
} 

Answer 3

Я только что изменил два правила в вашем CSS:

td:not(:last-child), th:not(:last-child) { /* I just added ':not(:last-child)' here */ 
    border: 1px solid #dddddd; 
    text-align: left; 
    padding: 8px; 
} 

tr:nth-child(even) td:not(:last-child) { /* And here */ 
    background-color: #dddddd; 
} 

I также предложите изменить свои снимки в своем html от <img></img> до <img> becuase "The tag is empty, it contains attributes only, and does not have a closing tag.".

Here is my live example