I can not center a canvas

for(var cont=1; cont<=14; cont++) {
  cajaconestilo(cont)
}

function cajaconestilo(cont) {	
  var con = cont;
	var caja = document.getElementById("cajaconestilo" + con);
	var cajaconestilo = caja.getContext("2d");
  	
  	cajaconestilo.lineWidth = 3;
	cajaconestilo.strokeStyle = '#cc9966';
	
	/*Esquina izquierda abajo*/
	/*EjeX*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(30,30);
	cajaconestilo.lineTo(50,30);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
	
	/*EjeY*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(30,30);
	cajaconestilo.lineTo(30,50);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
	
	/*Esquina izquierda arriba*/
	/*EjeX*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(30,120);
	cajaconestilo.lineTo(50,120);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
	
	/*EjeY*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(30,120);
	cajaconestilo.lineTo(30,100);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
	
	/*Esquina derecha arriba*/
	/*EjeX*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(270,120);
	cajaconestilo.lineTo(250,120);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
	
	/*EjeY*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(270,120);
	cajaconestilo.lineTo(270,100);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
	
	/*Esquina derecha abajo*/
	/*EjeX*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(270,30);
	cajaconestilo.lineTo(250,30);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
	
	/*EjeY*/
	cajaconestilo.beginPath();
	cajaconestilo.moveTo(270,30);
	cajaconestilo.lineTo(270,50);
	cajaconestilo.stroke();
	cajaconestilo.closePath();
}

.contendor-tmp {
	margin: 10px;	
	display: grid;
  grid-gap: 5px 20px;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); 
	grid-template-rows: repeat(auto-fit, minmax(100px, 1fr)); 
}

.tmp {	
	position: relative;
	padding: 0;		
   background-color: blue;	
	
	display: flex;
	align-items: center;
  justify-content: center;	
}

.enlace {
	position: absolute; 		
	font-family: 'Roboto', helvetica, serif, sans-serif;
  font-weight: normal; 
  font-style: normal;
	font-size: 1rem;	
	letter-spacing: 1px;		
}

a {
  color: white;
  font-weight: 900;
}

<div class="contendor-tmp">
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo1"></canvas>    
    <span class="enlace"><a href="#">Enlace 1</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo2"></canvas>    
    <span class="enlace"><a href="#">Enlace 2</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo3"></canvas>    
    <span class="enlace"><a href="#">Enlace 3</a>	</span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo4"></canvas>    
    <span class="enlace"><a href="#">Enlace 4</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo5"></canvas>   
    <span class="enlace"><a href="#">Enlace 5</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo6"></canvas>   
    <span class="enlace"><a href="#">Enlace 6</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo7"></canvas>    
    <span class="enlace"><a href="#">Enlace 7</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo8"></canvas>    
    <span class="enlace"><a href="#">Enlace 8</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo9"></canvas>    
    <span class="enlace"><a href="#">Enlace 9</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo10"></canvas>   
    <span class="enlace"><a href="#">Enlace 10</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo11"></canvas>   
    <span class="enlace"><a href="#">Enlace 11</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo12"></canvas>    
    <span class="enlace"><a href="#">Enlace 12</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo13"></canvas>   
    <span class="enlace"><a href="#">Enlace 13</a></span>
  </div>
  <div class="tmp auto-fit">
    <canvas id="cajaconestilo14"></canvas>    
    <span class="enlace"><a href="#">Enlace 14</a></span>
  </div>
</div>