I have some HTML/CSS which is working perfectly in Firefox; however, in Chrome, the form/border is being squeezed! I have been playing with the code for hours to no avail. Can anyone please help? Thanks!
I don’t know why it’s happening, but it appears giving an extra pixel of left/right padding to Chrome only will fix it. Not much as a good fix, but this hasn’t had any replies yet.
It’s’ a known chrome bug on inputs and you can’t have a border-radius that adds up to more than the height of the element. If you want it perfectly round then make sure the dimensions are exact.
Thank you so much for your answers, Ryan and Paul!
Hasty me, I despairingly lost hope that anyone would answer after 24 hours, so I just stopped looking at my code for a couple of weeks. Today I decided to check on here again and thankfully I did! I’m now inspired to go back to my code and finish the site I was working on. Thanks so much guys for all your help!
Paul, thanks for the code. It is working perfectly now! I also asked this on stack overflow, so if you have an account there, you can paste your answer there and I’ll select it as the best answer; otherwise, I’ll paste your answer there linking over here to credit you.
Besides learning this CSS bit, I also learned the lesson that next time I shouldn’t be so hasty!