ie6中如何让 input 框垂直居中？

奇奇 2011-01-04 10:59:50

ie6中如何让文字和 input 框垂直居中？
代码为：<p>用户名：<input type="text" style="width:50px; height:15px;" /></p>

...全文

116 2 打赏收藏转发到动态举报

写回复

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

86y 2011-01-04

打赏
举报

回复

input{vertical-align:middle}
.p{padding:5px;}
然后给p添加一个样式p

孟子E章 2011-01-04

打赏
举报

回复

你可以设置padding-top自己调整。

浏览器支持所有浏览器都支持 line-height 属性。这就奇怪了，既然支持为什么不居中呢？解决这个问题可以用pading设置上下填充，但是如果文本框有背景图片的话就会向下凸出一块，此时可以把max-height值设为height的值。但为什么会出现不居中，实在是搞不明白。

表单页面，为了使表单元素和文字都垂直居中对齐，加个样式input,select{vertical-align:middle}，文本框和下拉框都没问题，但是单选框和复选框就杯具了。大多表现：单选，复选和文字无间距，单选文字偏上，复选偏上。关于这些问题网上有人发表了看法，用table搞定一切。这个也是一种方法，哥也不BS。对于ie6,7下的文字间距问题，网上看到有人说设置width:14px就好了，我试了下发现width:13px更佳。这个问题解决。对于文字偏上的问题，试了vertical-align下的所有属性都不行。后来发现vertical-align是可以设置数值的，真是白混了这么

如今这世道,各大浏览器横行,杯具的是还不按套路来。方便了广大群众，害苦了网页设计师。说实话真怀念当年微软垄断的时代。只有一个IE6.什么事也不会发生。虽然IE6也是相当的垃圾… 一直以来,在HTML中,img input select button 这里元素，垂直对齐,比较难。结果我长大了。我发现了一个现像，其实解决这些问题只是一句话的事。 img, input, select, button{vertical-align:middle;} 如: 复制代码代码如下: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitiona

飞鱼的声纳顶部的搜索框让我头疼了很长时间，原因是总不能获得跨浏览器的统一样式。主要的问题有这么两个：一是input标签的高度不能统一，Firefox和IE中的高度始终不能一致；二是在IE浏览器中属性为text的input标签中的输入文字不像标准浏览器中的那样垂直居中显示，而是靠输入框的左上角显示。　　为了彻底解决搜索框的这些问题，我以GreenGaint主题搜索框的样式为准，重写了一遍代码并且以像素为单位测量了一下在没有任何样式表的情况下＜input>标签在默认浏览器中的实际差别。　　结果发现：input标签在type为text时，在Firefox和Safari中的默认高度为22像素（包括

请在各浏览器里查看以下input的显示效果！解决后显示效果！具体代码 .button{ margin:0; padding:0 0.25em; width:auto; *width:1;/*宽度不带单位我是第一次见，不知道其作用！- -!*/ overflow:visible; } 还有一个问题就是input的文字垂直居中问题，这里引用一下！ fedcn 默认情况下，在IE6/7下，按钮中的文本居中的不是很精确，需要调整，而在IE8 Beta2下，按钮中的文字位置貌似是固定不变的。经过反复测试，发现对按钮设置适当的行高值就可以解决，其中在IE6/8下， line-height = h

61,115

社区成员

60,728

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章