HTML CSS Coding Quesiton

HTML CSS

Is there multiple ways to solve this project, I have entered my code for the first input portion and it seems to check all the boxes?

However seeing some of the other students code in the forums mine looks much simpler and way less complex. I think it works fine visually but maybe someone could let me know if it truly completes these tasks.

  • … is 600px wide when the screen is greater than or equal to 600px wide
  • … uses grid layout to layout labels and form elements when the screen is greater than or equal to 600px wide
  • … is the width of the screen when the screen is less than 600px wide
  • … lays out the labels and form elements as full width when the screen is less than 600px wide

I saw that some people put each input in its own

I’m just wondering if thats necessary or if it is okay to lay it out the way I did.

(manually entering the CSS because I can only upload 1 image as a new user… can someone tell me how I can get passed that issue as well?)

form {
display: grid;
grid-template-columns: 100%;
max-width: 600px;
}

.userlabel {
width: 100%
}
.userinput {
box-sizing: border-box;