Using Media Query in CSS in a Form [closed]

I was trying to create a responsive web login form which the original(desktop screen) was alright but I tried using media query for CSS and I am still having some difficulties, the login button and input boxes which are longer than the background. I tried increasing it in the code but it still didn't work.

This is the code:

.modal {  position: fixed;  width: 50%;  margin: 10px 25% 0 25%;  height: 100%;  overflow: auto;  padding-top: 60px;}    @media screen and (max-width: 600px) {  .modal {      width: 100%;      margin: 0;  }}  

The was result I got after writing the code login form picture

https://stackoverflow.com/questions/66609384/using-media-query-in-css-in-a-form March 13, 2021 at 09:49AM