最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

文本框设置100%宽度,内容过多时所在td的宽度失效_html/css_WEB-ITnose

来源:动视网 责编:小采 时间:2020-11-27 16:18:41
文档

文本框设置100%宽度,内容过多时所在td的宽度失效_html/css_WEB-ITnose

文本框设置100%宽度,内容过多时所在td的宽度失效_html/css_WEB-ITnose:最近在修改项目的一个需求变更时,无意间发现了以前的一个问题, 这里拿出来讨论,可能在其他项目中没有碰到这样的需求或者无意中规避了这个问题 也或许已经有html&CSS高手把问题解决,都请来分享一下经验: 问题描述如下 因为客户不太懂技术,把上述td的宽
推荐度:
导读文本框设置100%宽度,内容过多时所在td的宽度失效_html/css_WEB-ITnose:最近在修改项目的一个需求变更时,无意间发现了以前的一个问题, 这里拿出来讨论,可能在其他项目中没有碰到这样的需求或者无意中规避了这个问题 也或许已经有html&CSS高手把问题解决,都请来分享一下经验: 问题描述如下 因为客户不太懂技术,把上述td的宽


最近在修改项目的一个需求变更时,无意间发现了以前的一个问题,

这里拿出来讨论,可能在其他项目中没有碰到这样的需求或者无意中规避了这个问题

也或许已经有html&CSS高手把问题解决,都请来分享一下经验:

问题描述如下

因为客户不太懂技术,把上述td的宽度设置了百分比,然后为了好看又把里面的文本框也设置了width:100%,想让他自适应

更改之后变成这样

 1  2  3 4  5  6  7  8  9 12 13 16 17 
th110 11 th214 15
18 19 20 21 24 25 26 27 28 31 32 33 34 35 38 39 40 41 42 45 46 47 48 49 52 53 54
th122 23
th129 30
th136 37
th143 44
th150 51
55 56

因为是老代码,这个画面恶心的地方首先是第一行和下面的各行不在一个table里,

图中的这个文本框对应的数据库表对应的字段是一个100位英文内容,如果满位输出的话,画面变成了这样。。

 1  2  3 4  5  6  7  8  9 12 13 16 17 
th110 11 th214 15
18 19 20 21 24 25 26 27 28 31 32 33 34 35 38 39 40 41 42 45 46 47 48 49 52 53 54
th122 23
th129 30
th136 37
th143 44
th150 51
55 56

目测,这个文本框因为有一个maxlength=100,的设置,ie试图在允许的范围下,把内容全部显示,但是这样的话,画面就乱了,

测试环境是:IE 9,IE 8下也存在该问题,在chrome下完美解析,如下图:

所以据此推测是IE在解析INPUT上和chrome内核不太一致,但是现在开发是在IE8上进行,除了设置固定width和使用Js动态加载,有没有别的办法来兼容解决问题。。

注:style=“table-layout:fixed”我用过了,但是这个办法有点狠,不太适合

文档

文本框设置100%宽度,内容过多时所在td的宽度失效_html/css_WEB-ITnose

文本框设置100%宽度,内容过多时所在td的宽度失效_html/css_WEB-ITnose:最近在修改项目的一个需求变更时,无意间发现了以前的一个问题, 这里拿出来讨论,可能在其他项目中没有碰到这样的需求或者无意中规避了这个问题 也或许已经有html&CSS高手把问题解决,都请来分享一下经验: 问题描述如下 因为客户不太懂技术,把上述td的宽
推荐度:
标签: 文本框 100 100%
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top