HTML/CSS; form not exactly as wide as screen when less than 600px

Learning Challenge

HTML/CSS challenges, form section


Screenshot #1: When my screen is less than 600px, it looks like the form is the width of the screen, but when i hover over the form element in the inspector, the form is slightly less wide than the screen. It looks like this can be because of the margin? In Screenshot 1-2, the screen width(html) is 544px, while the form is 528px wide. Is there something wrong with my css code? Is this a non-issue? Does this part of the assignment look okay?

What I’ve tried

I thought it had to do with the field-set so i deleted the fieldset part from the html code, but that didn’t work. I also tried messing with the margin in the css code of the form.


Screenshot 1

Screenshot 2

Here’s my html code:

Here’s my css:

UPDATE: I still need clarification, but i think I fixed it. I hope this wont be wrong when I submit it.

I added at the the top of my css code by changing the margin of the body to zero. Is this unnecessary?

Now when the screen is less than 600px, the form is exactly the the size of the screen.

1 Like

Hi Oriade,
I was about to pull up your work to answer your question…but I see that you nailed it!
Congratulations. I can see you did some really solid problem-solving on your own.

1 Like