Question

代码：

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

导致浏览器：

网址：https://groups.google.com/forum/#!topic/goratchet/8crWEoqStYI

为什么按钮位于行的第一行？我可以把行的按钮结束吗？任何想法？

Answer 1

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

希望这会有效，我不知道你的其他css规则

Answer 2

只需使用属性float将其放置在右侧或左侧

即可

<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>

如何将输入和按钮连成一行？

2 个答案: