How to put a input and a button in a row?

Question

code：

<div class="input-row">
      <input type="text" placeholder="Search"><button class="btn" >重发</button>
 </div>

result in browser：

URL : https://groups.google.com/forum/#!topic/goratchet/8crWEoqStYI

Why the button at the first of the row? Can i put the button end of the row? any ideas?

score 1 · Accepted Answer · answered Apr 09 '14 at 06:47

Just use the property float to position it right or left

<html>
  <body>
    <div style="width: 1000px; height: 600px; border: 1px solid red; position: absolute">
      <input type="text" placeholder="Search" style="float: left">

      <button style="float:right">MyButton</button>
    </div>
  <body>
</html>

score 0 · Answer 2 · answered Apr 09 '14 at 06:42

<div class="input-row">
    <div style="float:left;">
        <input type="text" placeholder="Search">
    </div>
    <div style="float:right;">
        <button class="btn" >重发</button>
    </div>
</div>

hopefully this will work, i dont know the rest of your css rules

How to put a input and a button in a row?

2 Answers2