Estou com dúvida no curso de Introdução a HTML e CSS, no exercício do capítulo Desafios finais.

Olá, Armando

Esse problema não é simples de arrumar. Existem algumas técnicas para resolver isso e uma delas (o flexbox) é abordada no curso avançado de HTML e CSS, na continuação da trilha de Front-End. Recomendo que você faça esse curso também.

percebi que todas as vezes que eu adicionar mais um projeto no portifolio, terei que aumentar o codigo do portifolio.html, com ul,li entres outras tags teria uma forma de fazer isso via js dinamico

Acho que você pode colocar uma altura fixa no li para que todos fiquem iguais. Por exemplo: .portfolio li{ display: inline-block; border: 8px solid black; background-color: #FAFFFC; width: 45%; box-sizing: border-box; padding: 16px; margin-right: 16px; margin-bottom: 16px; height: 100px; }

Pode ajustar o tamanho para que tudo se encaixe.

Rogério, existe uma forma de fazer isso dinamicamente, sim, com JS ou outras linguagens. Podemos fazer isso no próprio navegador usando JS, mas o ideal é fazer usando alguma linguagem do lado do servidor, gerando o HTML a partir de uma base de dados com os projetos cadastrados. Os cursos das trilhas PHP, Java para Web, Ruby e Rails e C# e .NET tratam desse problema usando diversas tecnologias. Vale dar uma olhada!

Felipe, essa solução é válida, também! O problema é que, quando fixamos a altura de um elemento, o texto que vai dentro dele não pode passar dessa altura, ou quebramos o layout. O ideal é deixar a altura dos elementos sempre automática para evitar esse tipo de problema, e aí o flexbox, que comentei acima, permite dizer que queremos que essa altura automática seja igual para todos os elementos dentro de um determinado container.

Armando Hilel, Posso estar "falando" besteira... Mas acredito que utilizando min-height e max-height resolveria em partes seu problema.