Tabela saindo da pagina

Boa tarde gente. Sou novo na programação e tô tendo uma dificuldade com a parte da tabela. Quero torná-la responsiva, mas ela fica saindo da página e não consigo de jeito nenhum deixar ela fixa.
Alguem sabe me auxiliar onde tô errando?

HTML:
<table id="valores">
<tr>
<td>Calories</td>
<td><strong>277kcal</strong></td>
</tr>
<tr>
<td>Carbs</td>
<td><strong>0g</strong></td>
</tr>
<tr>
<td>Protein</td>
<td><strong>20g</strong></td>
</tr>
<tr>
<td>Fat</td>
<td><strong>22g</strong></td>
</tr>
</table>

Style.css:
table#valores {
border-spacing: 0px;
margin-left: auto;
margin-right: auto;
width: 600px;
table-layout:fixed;

}

table#valores td{
padding: 8px;
margin: 0 auto;
align-items: center;
}

td:nth-child(1) {
width: 20%;
text-align:left;

}
td {
text-align:center;
}

td {
border-bottom: 1px solid black;
}