标签：
直接说问题吧：
<input type="text" class="fl"> <input type="submit" value="搜索">
以上是html代码，就是俩input
单纯的控制样式：
input[type=‘text‘]{ width: 460px; height: 30px; border: 2px solid #FF4E88; } input[type=‘submit‘]{ height: 34px; width: 80px; border: none; background: #FF4E88; color: #fff; line-height: 34px; text-align: center; }
结果：
中间的空隙咋解决？
相信你首相想到什么padding margin为0 之类的解决方法，可是都失败了~
那么 ，我摸索了一下
解决一：
改变html结构，让俩input不分开在一行
<input type="text" class=""><input type="submit" value="搜索">
来看结果：
解决二：
修改css，给前边一个input添加一个左浮动
.header .header-main .header-search input[type=‘text‘]{ width: 460px; height: 30px; border: 2px solid #FF4E88; float: left; /*重点在这*/ } .header .header-main .header-search input[type=‘submit‘]{ height: 34px; width: 80px; border: none; background: #FF4E88; color: #fff; line-height: 34px; text-align: center; }
结果：
如果 亲 还有其他解决方法欢迎给我留言哈~
我的口号是：发现问题，记录问题，分享问题~
标签：
原文地址：http://www.cnblogs.com/Imever/p/4601937.html
