Latest solutions

CSS grid

Durante o projeto, enfrentei desafios principalmente com o controle de versão usando Git, especialmente ao lidar com conflitos de merge e rebase entre o repositório local e o remoto. Também tive dificuldades para alinhar perfeitamente o layout com Flexbox e garantir que a imagem e o conteúdo ocupassem exatamente o mesmo espaço, além de ajustar o overlay roxo sobre a foto.

Superei esses desafios pesquisando soluções específicas para conflitos no Git, utilizando comandos como git rebase --continue e resolvendo manualmente os conflitos nos arquivos. No CSS, revisei a estrutura dos containers, utilizei propriedades como flex: 1 e min-width: 0, e testei diferentes configurações de Flexbox até alcançar o resultado desejado. A documentação oficial e exemplos de outros projetos foram fundamentais para encontrar as melhores práticas e resolver os problemas encontrados.

If you find any betterments in the project, please let me know.

organization of my html

This time I don't have any specific area at the moment that requires guidance or help, but I know that I still need to improve and I know that I could further improve the design and the versatility and reduction of code for a more optimal page for everyone. Anything you have to tell me to change or correct, I know that it will be of great help to continue growing and advancing even more.

Any feedback is welcome!

como simplificar mais o css, sinto que coloco muita coisa atoa

If there are better ways to utilize the styles guide, for the colors I wasn't sure how to use hsl in my code so I just converted it to hex. Also if there's a better way to structure the html i used a lot of divs.

Open to any feedback that can help me improve.

I'm not sure about using the margin and the padding correctly. My design matches the one in Figma, but as for those two properties, my CSS code looks a little bit chaotic to me. I feel like there are too many margins and paddings:

.container {
  margin: 60px auto;
  padding: 16px 16px 40px 16px;
...
}

.text-area {
  padding: 24px 16px 0 16px;
...
}

.text-area__title {
  margin-top: 0;
  margin-bottom: 16px;
...
}

.text-area__text {
  margin: 0;
...
}

I need to learn to reduce the code that I repeat.

The best way to center things, and space them.

Check out if my CSS padding, width, height, and margin is good.

I don’t need help with anything specific at the moment, but feedback is always welcome.

While I'm proud of the current implementation, there are a few areas I'd like guidance or feedback on to improve further:

Responsive Design Without Media Queries: I used the clamp() function to handle responsiveness, but I’m still exploring best practices for using it effectively across different elements like padding, margins, and container widths.

Is there a better way to calculate mortgage repayment and interest?

I would appreciate feedback on how to improve the accessibility of the form elements and buttons, especially regarding keyboard navigation and screen reader friendliness.

Also, if there are suggestions on optimizing the CSS structure for scalability or alternative layout techniques (like CSS Grid) that could make the code cleaner, I’d be interested in learning more.

En el CSS.