首頁 >web前端 >html教學 >IE6的input,如果设置了宽度,多输入一些字符,input会被顶跑?_html/css_WEB-ITnose

IE6的input,如果设置了宽度,多输入一些字符,input会被顶跑?_html/css_WEB-ITnose

WBOY
WBOY原創
2016-06-24 12:14:011210瀏覽



.se_name{ width: 110px; height: 23px; background: url(../images/search_bg.jpg) no-repeat; color: #c0c0c0; border: none; margin-right: 8px; line-height: 23px; padding-left: 4px;}


如果输入的字符宽度不超过设置的宽度,显示正常 
在IE6下 若输入字符超过设置的宽度,就会出现被顶到左边的情况

该如何解决这个问题呢


回复讨论(解决方案)

重构下html

重构下html



我说的是这个意思,刚开始显示正常的时候是这张图

如果输入字符过多,就变成下面这样了

给文本框设置一个合适的宽度值(width)。不过你用border:0和背景图片的方式来表现文本框的边框还是很难做到精确控制的,比如设置文本框宽度为100px,在标准浏览器下查看盒子模型,宽度就是100px,但在IE6/7/8下面查看是102px,浏览器之间存在差异。

刚刚看得不够仔细,原来你已经设置了宽度值。用IETester的IE6.0模式测试没有出现你说的这种情况,背景图片的边框宽度与设置宽度110px一样吗?

设置background-attachment属性为fixed.
background: url(../images/search_bg.jpg) no-repeat fixed;
不知有没有实现你希望的效果?

设置background-attachment属性为fixed.
background: url(../images/search_bg.jpg) no-repeat fixed;
不知有没有实现你希望的效果?
多谢,解决了

给文本框设置一个合适的宽度值(width)。不过你用border:0和背景图片的方式来表现文本框的边框还是很难做到精确控制的,比如设置文本框宽度为100px,在标准浏览器下查看盒子模型,宽度就是100px,但在IE6/7/8下面查看是102px,浏览器之间存在差异。
多谢讲解,还没注意这个呢

那么你在火狐下  那个文本框背景  还显示吗?

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn