Caja de texto y botón juntos y a la misma altura

[linternazo]

Hola muchachada:

Mi problema es el siguiente. Quiero poner una caja de búsqueda y un botón unidos de manera muy similar al buscador de la cabecera de facebook.

El caso es que no consigo que queden unidos ni a la misma altura. Os pongo un ejemplo:



He intentado jugar con los paddings, meterlos en el mismo div, meterlos en divs distintos y nada.

Sólo he conseguido unirlos usando coordenadas absolutas y aún así se ve distinto en cada navegador.

¿Existe alguna manera standar de unir exactamente un textbox y una imagen con CSS? Si no la hay, teneis alguna idea de como podría conseguirlo?

Muchas gracias de antemano.

[awesomeboy]

Pues no es muy ortodoxo, pero podrías hacerlo primero que nada metiendo ambos elementos en un div, con ancho indefinido, pero alto exacto, ya que tanto el textbox como el botón asumo que tendrán la misma altura.

A ambos les das float:left; y al segundo que es el del botón, le das position:absolute; con esto tu botón quedara justo encima y al inicio del textbox, ya simplemente lo recorres con un margin-left:?px; donde ?px, es el valor exacto en pixels a recorrer tu botón a la derecha hasta que llegue a su destino.

Bueno pues espero haberte ayudado. Salu2