input com position absolute

Tenho uma pagina com um trecho parecido com esse:

<style>
	#f{
 position:absolute;
 top:50px;
 left:10%;
 right:10%;
 margin:0 60px;
	}
	#f input[type=text]{
 position:absolute;
 left:3px;
 right:105px;
	}
	#f input[type=submit]{
 position:absolute;
 right:2px;
 display:block;
 width:100px;
	}
</style>

<form id="f">
<input type="text">
<input type="submit">
</form>

Esperava com isso obter uma form com largura responsiva em que o campo de texto ocupa todo o espaço disponível para ele dentro do bloco form.

Porem ao testar tanto no chrome quanto no firefox obtenho um campo de tamanho fixo que não ocupa todo o espaço dentro da form como também excede a largura da form quando ela é menor que essa largura fixa.

Alguém sabe como contornar isso?