Responsive profile card with HTML and CSS

Community feedback

• 

  Daniel 🛸•44,250

  @danielmrz-devPosted 10 months ago

  Olá Tauane!

  Sua solução pra esse projeto foi bem criativa! Especialmente os círculos do background.

  Achei interessante criar uma div pra cada imagem e posicioná-las separadamente.

  Caso você queira uma maneira mais simples de resolver esse desafio, aqui segue uma:

  Aplicar isso ao body:

    background-color: var(--Dark-cyan);
    background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg");
    background-repeat: no-repeat, no-repeat;
    background-position: right 52vw bottom 35vh, left 48vw top 52vh;
  

  Foi nesse desafio que eu descobri que era possível utilizar mais de uma imagem ao mesmo tempo de background e ainda por cima, manipulá-las separadamente. Acho justo compartilhar com você 😊

  Espero que ajude!

  Marked as helpful

  0

  ---

  

  Tauane Custódio•330

  @tauanecustodioPosted 10 months ago

  Obrigada @danielmrz-dev, pesquisei bastante sobre isso e tentei de várias formas mas não encontrei nada sobre colocar mais de 2 valores no background-position, então o layout sempre quebrava, obrigada por compartilhar comigo!!!

  1