Good morning.
I made a table with the rounded edges however, apparently tds are on the table and not inside it, as if it were a background image follows the CSS HTML :
<style>
.tabela {
border-radius: 15px;
background: #C0C0C0;
padding: 20px;
width: 600px;
height: 70px;
}
#tr1{
background: #FFD700;
padding: 20px;
width: 600px;
height: 70x;
}
#tr2{
background: #006400;
padding: 20px;
width: 400px;
height: 70x;
}
#tr3{
background: #008000;
padding: 20px;
width: 400px;
height: 70x;
}
#tr4{
background: #228B22;
padding: 20px;
width: 400px;
height: 70x;
}
#tr5{
background: #32CD32;
padding: 20px;
width: 400px;
height: 70x;
}
#tr6{
background: #00FF00;
padding: 20px;
width: 400px;
height: 70x;
}
#tr7{
background: #7CFC00;
padding: 20px;
width: 400px;
height: 70x;
}
#tr8{
background: #7FFF00;
padding: 20px;
width: 400px;
height: 70x;
}
#tr9{
background: #ADFF2F;
padding: 20px;
width: 400px;
height: 70x;
}
#tr10{
background: #FFFF00;
padding: 20px;
width: 400px;
height: 70x;
}
</style>
<table class="tabela">
<tr id="tr1">
<td><strong>Informacao Nutricional<small><br>Porcao ___g ou ml (medida caseira)<small></strong></td>
</tr>
<tr id="tr2">
<td>Quantidade por porcao</td>
<td>% VD (*)</td>
</tr>
<tr id="tr3">
<td>Valor energetico</td>
<td>...kcal=...Kj</td>
<td> 2 </td>
</tr>
<tr id="tr4">
<td> Carboidratos</td>
<td>g</td>
<td> 1 </td>
</tr>
<tr id="tr5">
<td>Proteina</td>
<td>g</td>
<td> 3 </td>
</tr>
<tr id="tr6">
<td>Gorduras Totais</td>
<td>g</td>
<td> 0 </td>
</tr>
<tr id="tr7">
<td>Gorduras Trans</td>
<td>g</td>
<td> - </td>
</tr>
<tr id="tr8">
<td>Fibra Alimentar</td>
<td>g</td>
<td> 1 </td>
</tr>
<tr id="tr9">
<td>Sodio</td>
<td>mg</td>
<td> 15 </td>
</tr>
<tr id="tr10">
<td>(*)<small> % Valores diarios com base em uma dieta de 2.000 Kcal ou 8400KJ. Seus valores diarios podem ser maiores ou menores dependendo das suas necessidades energeticas.</small></td>
</tr>
</table>