Как состыковать элементы формы

[Gride]

Всем привет,

подскажите пожалуйста, как вот эту форму из картинки, поля ввода и кнопки состыковать в один "неразрывный" элемент

код формы:

 <form action="index.php" id="search_id" method="get" onsubmit="return search_checkup();">
         <a href="/index.php?language_id=1&section_id=31"><img alt="Помощь" class="help" src="templates/images/search_help.png"></a>
         <input accesskey="s" alt="Поиск" id="text_id" maxlength="64" name="text" title="Поиск" type="search" value="" />
         <input alt="Поиск" id="submit_id" src="templates/images/search_submit.png" title="Поиск" type="image" value="Поиск" />
      </form>

CSS-код:

form#search_id {left: 16pt; margin: 0; position: absolute; top: 16pt;}
form#search_id .help {border: none; height: 24px;}
form#search_id input#text_id {background: url('images/search_text.png') repeat-x; border: none; font: 14px Tahoma, Verdana, sans-serif; height: 24px; margin: 0; padding: 2px 0 2px 0; width: 240px;}
form#search_id input#submit_id {}

Пытался расковырять поисковую форму с этого сайта, но как-то IQ не хватило, хочется понять для чего каждый из параметров, а не тупо скопировать.

[psywalker]

float:left; тебе в помощь. Только изначально выкинь position: absolute;

[Gride]

Спасибо! float позволил все выровнять и соединить.

Правда, в IE 6 между картинками небольшой зазор остается.

А чем position: absolute вреден? Мне необходимо на одном уровне в шапке сайта вывести поисковую форму и меню языков. Помоему, вполне удобно каждый из этих блоков объявить как position: absolute и позиционировать.

Edited November 12, 2010 by Gride

[deadrash]

Правда, в IE 6 между картинками небольшой зазор остается.

Вполне возможно из за пробела в самой разметки страницы. т.е. если

<a></a> <input></input>

или если

<a></a>

<input></input> то пробел будет.

а если <a></a><input></input> то не будет.

[Gride]

Вполне возможно из за пробела в самой разметки страницы.

Не помогло. Даже после размещения всех тегов на одной строке пробелы остались.