I hope I am understanding your problem, correctly.
For your buttons: The float property will cause your elements to flow around each other, https: //www.smashingmagazine.com/2007/05/css-float-theory-things-you-should-know/
I refactored your css to use flex, which unfortunately isn’t supported in all browsers http ://caniuse.com/#search=flex-box
Flex is a great way to position elements inside a container.
For your input:, it is at a 40% width and that will become smaller than the buttons which do not resize based on a percentage value. For this I provided to the input a px value for min-width to stop it from shrinking further.