---
id: 5a9036d038fddaf9a66b5d32
title: Add Columns with grid-template-columns
challengeType: 0
videoUrl: ''
localeTitle: Añadir columnas con cuadrícula-plantilla-columnas
---
## Description
Simplemente crear un elemento de cuadrícula no te lleva muy lejos. También es necesario definir la estructura de la cuadrícula. Para agregar algunas columnas a la cuadrícula, use la propiedad grid-template-columns en un contenedor de cuadrícula como se muestra a continuación:
```html
.container {
display: grid;
grid-template-columns: 50px 50px;
}
```
Esto le dará a su cuadrícula dos columnas de 50px de ancho cada una. El número de parámetros dados a la propiedad grid-template-columns indica el número de columnas en la cuadrícula, y el valor de cada parámetro indica el ancho de cada columna.
## Instructions
Definir al contenedor de la cuadrícula tres columnas de 100px de ancho cada una.
## Tests
```yml
tests:
- text: container clase container debe tener una propiedad de grid-template-columns con tres unidades de 100px .
testString: 'assert(code.match(/.container\s*?{[\s\S]*grid-template-columns\s*?:\s*?100px\s*?100px\s*?100px\s*?;[\s\S]*}/gi), "container class should have a grid-template-columns property with three units of 100px.");'
```
## Challenge Seed
## Solution
```js
// solution required
```