[Duda.Ml1986@gmail.com]

Всем привет.
Есть вот такая верстка:

Прикол в том что при изменении экрана иконка с лупой перемещается в плохом направлении, то есть если расширение более 1000пх то норм, а вот стили адаптиновсти прописаны на диапазон: 768 / 999

и получается что нужно еще будет специально прописывать стили этого инпута для расширения например 785, когда он сьехал.

Короче говоря если блок 100%, а картинка 37 пх по высоте и ширине 36 пх как ее прикрутить раз и навсегда?

Для примера предлагаю посмотреть мои потуги в "адаптивном бою" http://duvanov.url.ph/

.col span_1_of_4{
width: 100%
}
#search {
    width: 100%;
    height: 37px;
    position: relative;
    padding: 0;
    margin: 0;
    margin-bottom: 10px;
}
#search input[type=text] {
    border: 0;
    border: none;
    border: 1px solid #87c602;
    -webkit-border-radius: 7px 0 0 7px;
    -moz-border-radius: 7px 0 0 7px;
    -ms-border-radius: 7px 0 0 7px;
    -o-border-radius: 7px 0 0 7px;
    border-radius: 7px 0 0 7px;
    padding: 9px;
    margin: 0;
    height: 16px;
    font: bold 16px calibri;
    color: #a3a4a5;
}
#search input[type=submit] {
    background: none;
    border: 0;
    border: none;
    width: 36px;
    height: 37px;
}
#search_btn {
    width: 36px;
    height: 37px;
    background: url(../img/search/search_btn.png);
    background-repeat: no-repeat;
    vertical-align: middle;
    position: absolute;
    right: 5px;
    top: 0;
}

<div class="col span_1_of_4">
                <div id="search">
                    <form method="get" action="mysite.com">
                        <input type="text" name="q" value="поиск" onfocus="this.value=''" onblur="if (this.value==''){this.value='поиск'}">
                        <div id="search_btn">
                            <input type="submit" value="&nbsp;">
                        </div>
                    </form>
                </div>