All comments

• 

  Francis•10

  @franfran20Submitted over 3 years ago

  Is there a better way to do this? Or a more efficient way of doing this?

  

  I used width and max-width for the responsiveness

  2

  10
  

  ravenloue•40

  @ravenlouePosted over 3 years ago

  It looks very close to the design overall, but I'm noticing a few issues.

  The desktop background image is aligned to the left and doesn't cover the whole page. Someone suggested to me to use "background-size: 100vw 40vh" to handle this on my own submission.

  You said in your github link that you had used 'width and max-width' in flexboxes to handle responsiveness, but it doesn't feel very responsive. The box moves around and stays centered, but the background and container size don't change for mobile versions. Also, the buttons don't change on hover like they do in the design.

  I personally found using media queries efficient and super helpful for separating the mobile version from the desktop version. But if you're bound and determined to avoid them, I found this blog that might be what you're looking for in terms of a solution.

  0