<sectionid="description"> O oposto de <code>flex-shrink</code> é a propriedade <code>flex-grow</code> . Lembre-se de que <code>flex-shrink</code> controla o tamanho dos itens quando o contêiner encolhe. A propriedade <code>flex-grow</code> controla o tamanho dos itens quando o contêiner pai se expande.
Usando um exemplo semelhante do último desafio, se um item tiver um valor de <code>flex-grow</code> igual a 1 e o outro tiver um valor de <code>flex-grow</code> igual a 3, aquele com o valor de 3 crescerá três vezes mais que o outro. </section>
<sectionid="instructions"> Adicione a propriedade CSS <code>flex-grow</code> a ambos <code>#box-1</code> e <code>#box-2</code> . Dê a <code>#box-1</code> um valor de 1 e a <code>#box-2</code> um valor de 2. </section>
- text: 'O elemento <code>#box-1</code> deve ter a propriedade <code>flex-grow</code> definida como um valor de 1.'
testString: 'assert($("#box-1").css("flex-grow") == "1", "The <code>#box-1</code> element should have the <code>flex-grow</code> property set to a value of 1.");'
- text: 'O elemento <code>#box-2</code> deve ter a propriedade <code>flex-grow</code> definida como um valor de 2.'
testString: 'assert($("#box-2").css("flex-grow") == "2", "The <code>#box-2</code> element should have the <code>flex-grow</code> property set to a value of 2.");'