Tengo lo siguiente
.contenedor {
width: 900px;
margin: auto;
}
.bg-logo {
background: #4a4045;
height: 60px;
padding: 14px 0 0 50px;
}
#opciones {
background: #6b6063;
}
ul {
list-style-type: none;
margin: 1;
padding: 0;
overflow: hidden;
}
li {
float: left;
}
li a {
display: inline-block;
color: white;
padding: 14px 16px;
text-decoration: none;
}
li a:hover {
color: #ea1c2c;
}
.active {
background-color: #6b6063;
}
button:hover {
background: rgba(0, 0, 0, 0);
color: #3a7999;
box-shadow: inset 0 0 0 3px #3a7999;
}
#fondo {
width: 900px;
height: 200px;
background-image: url('../Imagenes/fondo.png');
}
table {
width: 900px;
margin: auto;
border-collapse: collapse;
}
tr:nth-of-type(odd) {
background: #eee;
}
th {
background: #333;
color: white;
font-weight: bold;
}
td,
th {
padding: 6px;
border: 1px solid #ccc;
text-align: left;
}
<!DOCTYPE html>
<html>
<head>
<title>2019</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/Estilo.css">
</head>
<body>
<div class="contenedor">
<div class="bg-logo">
<img src="Imagenes/Logotipo.png">
</div>
<table>
<tr>
<th rowSpan="2">TERRITORIO</th>
<th rowSpan="2">ESQUEMA</th>
<th colspan="2">2016</th>
<th colspan="2">2017</th>
<th colspan="2">2018</th>
<th colspan="2">2019</th>
<th colspan="2">Var % 16-17</th>
<th colspan="2">Var % 17-18</th>
<th colspan="2">Var Abs 18-19</th>
<th colspan="2">Var % 18-19</th>
</tr>
<tr>
<th>NO</th>
<th>MONTO</th>
<th>NO</th>
<th>MONTO</th>
<th>NO</th>
<th>MONTO</th>
<th>NO</th>
<th>MONTO</th>
<th>NO</th>
<th>MONTO</th>
<th>NO</th>
<th>MONTO</th>
<th>NO</th>
<th>MONTO</th>
<th>NO</th>
<th>MONTO</th>
</tr>
</table>
</div>
</body>
</html>
Mi tiene width: 900px pero, la tabla lo sobrepasa, saben como puedo ajustar la tabla al tamaño del