消除输入和按钮之间的间隙

Question

我正试图在文本字段旁边放一个按钮.

在这里,我认为代码可以使它工作

<input class="txt" type="text" name="name">
<button class="btn">Submit</button>


.txt {
  display: inline-block;
  width: 80%;
  outline: none;
  margin:0;
}

.btn {
  display: inline-block;
  width: 20%;
  margin:0;
}

http://jsfiddle.net/rm9etsny/

但是,这两个要素之间仍然存在差距.我该如何删除它？

谢谢

Answer 1

您可以将html内容放入内联.这将删除空间而没有边缘左侧为负

<input class="txt" type="text" name="name"><button class="btn">Submit</button>

另外,为了使它们在水平行中对齐,您需要考虑给输入少一些%.

演示 - http://jsfiddle.net/RahulB007/rm9etsny/5/