Как разместить два блока

[alleclf]

Как можно разместить два блока на всю ширину родителя, если один блок определенного размера, а второй должен растянуться.

Например, форма со строкой для ввода текста и кнопка. То есть, кнопка всегда одного размера, а строка должна заполнить всё оставшееся пространство.

Заготовка - http://jsfiddle.net/n1tp49a1/

Нужен кроссбраузерный вариант работающий на всех устройствах включая мобильники.

[DivMan]

Теперь только проверяй, какие браузеры поддерживают свойство box-sizing

http://jsfiddle.net/k3hk6ja9/

<div class="main">
  <div id="menu"> 
     <input name="storyt" value="" type="text">
  </div>
  <div id="content">
    <button name="sendb" type="submit">btn</button>
  </div>
</div>

.main {
  position: relative;
}

#menu {
   width: 100%;
   padding-right: 35px;
   box-sizing: border-box;
 }
 
#content {
  position: absolute;
  top: 0;
  right: 0;
}

input {
  width: 100%;
}
button{
  width:30px;
}

 

http://jsfiddle.net/yRcg7/1/

[alleclf]

DivMan, спасибо