Desktop optimized design using HTML and CSS

Community feedback

• 

  Jesse•430

  @jesse10930Posted over 3 years ago

  Hi Urmi Jana, your project is looking good so far! For the hover-state of the buttons, you just have to add 'button:hover' to your stylesheet, and then add any changes that you want to happen. For example, if you want to change the arrow to a pointer, you could add the following:

  button:hover {
      cursor: pointer
  }
  

  As for responsive design, I'd recommend not using fixed pixels when styling the different elements because as the screen size changes, the element sizes will remain the fixed-pixel size that you defined in your original styling. Using unites like rems, ems, or percentages will respond when the screen size changes because these units are dependent upon their parent divs or the root element. So as the screen size changes, these elements will change size as well.

  Other tools you could look into for mobile CSS design are Flexbox, Grid, and mediaqueries.

  Hope this is helpful! Keep up the good work!

  1