输入组有两个文本输入和一个按钮

Question

我现在拥有一个输入文字和旁边的按钮：

<form id="chat-form">
    <div class="input-group">
        <input name="message" id="message" type="text" class="form-control">
        <span class="input-group-btn">
            <button class="btn btn-default" type="submit">send</button>
        </span>
    </div><!-- /input-group -->
</form>

http://jsfiddle.net/3mgycoop/

我希望旁边有两个输入和按钮。所有在一行中如下：

[         product        ][    price    ][ send-btn]

它应该是100％宽，就像我现在一样。

如何实现它？

Answer 1

在元素中添加一些ids并添加以下css：

#message{
    float:left;
    width:45%;
}
#message2{
    float:left;
    width:45%;
}
body {
    margin: 10px;
}

这里是小提琴：http://jsfiddle.net/3mgycoop/2/