HTML & CSS Text input box extends outside its container

[Malcolm]

Hi everyone,

I'm having an issue where my text input extends outside its container when using @media query set to a max width of 800px. I've tried setting the input to have a width of inherit and its parent to 100%, but it always seems to extend outside of its parent.

Outside query CSS:

#inputURL {
    max-width: 80%;
}

Inside query CSS:

input {
    width: 100%;
}

I would greatly appreciate all the help that I can get. Thank you!

 

[tomliv]

@Malcolm box-sizing: border-box? Do you have this posted somewhere we can see?