HTML CSS Animation

Community feedback

• 

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted almost 4 years ago

  Greetings, Thanh Nhi! 👋

  Nice work on this challenge! 🙌 Your solution looks pretty good and is responsive! 👍

  I'd like to suggest,

  • Adding min-height: 100vh to the body to ensure that it fills up the entire area of the viewport and the bottom-right background image always sticks to the bottom of the screen in the desktop layout.
  • You might want to set background-repeat to no-repeat for the background images in the mobile layout since they go a bit wonky then and turn into a repeating tiling pattern (or they might be added to the page twice, I'm not sure from looking at the dev tools). 😉

  Keep coding (and happy coding, too)! 😁

  2

  ---

  

  Thanh Nhi•155

  @lttn-16Posted almost 4 years ago

  @ApplePieGiraffe thanks, that helps me a lots!! 😍

  1
• 

  Ovidiu-Antonio•3,125

  @ovidiuantonioPosted almost 4 years ago

  Hello Thanh Nhi,

  Nice solution! You did a very good job! There are a few tips to improve your solution:

  • add max-width: 1440px; and margin: 0 auto; to the container, to keep the content looking good on larger screens too and consider adding the background images to the body instead of the container
  • hide the horizontal scroll, so it not show up when the animations play

  Happy coding and keep going!

  2

  ---

  

  Thanh Nhi•155

  @lttn-16Posted almost 4 years ago

  @ovidiuantonio thank you for helping me solving the problem with larger screens!

  0