- 29
- Jun
上篇:« 高段位路由入侵分析 // 下篇:jQuery 配合 CSS3 搞图片圆角 »
今天遇到一挺郁闷的bug
IE8 标准模式
要实现如图的效果,图片宽度最大100px,小于100就自适应,
右边文字围绕左边的图
症状:
图片外容器宽度还是取决于图片原始大小而非max-width定义的大小
测试可跑如下代码
<!DOCTYPE html><html><body><div style="background:#2CA0B7;float:left;"><img src="http://ooxx.me/me.jpg" style="max-width:50px;" /></div></body></html>
也可以看DEMO页
http://code.sh/lab/demo/bug_ie8_max-width.html
哪位大湿有无解决方案?
假装异步加载ing
订阅大猫的RSS feed,不错过一部AV~
暧昧贴
上篇:« 高段位路由入侵分析 // 下篇:jQuery 配合 CSS3 搞图片圆角 »
8O 
TX全部变圆角控和这有关不？
Reply
用JS吧。。。jQuery处理起来还是比较简单的
Reply
bigCat:
@whatUwant,
JS会增加客户端损耗,我宁愿IE8下写个hack定宽
只是寻找更好的解决方案
Reply
whatUwant:
@bigCat, 对于IE用户，我觉得加点损耗也无所谓，反正已经很慢了
Reply
bigCat:
@whatUwant, 我虽然讨厌IE,但不会拒绝IE,而且要做好IE,因为客户用的都是IE6,客户爽了才会掏钱
Reply
Reply
bigCat:
@tomie,
早搜过了... 不搜也不好意思拿出来问啊
你试过有效么?我试过无效
Reply
bigCat:
@tomie, 而且还不是一个bug
Reply
js 解决方式一枚 http://nfine.net/bugs/ie8bug.html
Reply
bigCat:
@tomie, 这个不是解决方案,而是展示bug用的.... JS我会啊,不过不希望用js去增加损耗
Reply
这个就是 http://jhop.me/ie8-bugs 第45个
IE8的bug也不少，推荐做法是不鸟它，带入IE7模式
Reply
bigCat:
@ytzong, 老湿,偶不要多那一句....昨天给jhop写了个邮件了已经
Reply
Reply
bigCat:
@星点, 所以拉出来求助,哈哈
Reply
不知道可以在这里直接开问否，先占了再说：
在IE8中打开http://www.newone.org/左下角提示‘网页上有错误“
网页错误详细信息
消息: 'document.getElementById(...)' 为空或不是对象
行: 20
字符: 279
代码: 0
URI: http://www.newone.org/wp-content/themes/newon/js/easytabs.js
Reply
bigCat:
@N1, document.getElementById(tablink_idname[menunr] + i) is null
[Break on this error] function easytabs(menunr, active) {if ...ge(){clearTimeout(timer);counter=0;}
easytabs.js (第 20 行)
找你们开发去
Reply
http://byzuo.com/demo/auto_width_height/
就这个意思吗？
Reply
bigCat:
@佐, 我想让图片父容器宽度自适应...
Reply
想不出解决方法，前排占位
Reply
既然不想增加损耗又要取悦该死的IE
那你还是多写点代码吧~~
PS:demo里的哥哥... 真正吖
Reply
bigCat:
@Yang, 没办法,经常因为帅而被驻足
对于这个问题,替代方案是有几个,只是想追求完美点嘛,放blog也是为了请教潜水的大湿们
Reply
俺也来折腾看看，为了IE6的问题，搞了一下午
Reply
啊~~~ 猫猫现在已经不鸟IE6啦~~ oh yah ~~~
Reply
bigCat:
@飞鱼, IE6下的问题基本都有替代的解决方案或整整hasLayout就好了 ：） 死IE8
Reply
猫啊，你想在img标签上使用max-width属性本身就是个不好的想法，这种标签上对这样的设置很不敏感的.外面加一层DIV吧!
Reply
bigCat:
@asins, = = 话说外面就是个div，bug发生的时候那个div被里头img的真实宽度撑开。。。
Reply
来围观。。。。。。。。。
Reply
电脑知识收藏夹:
@我吃西红柿,
来围观你顺便学日语……ブログ是主页？网址？雅蠛蝶？
Reply
Yang:
@电脑知识收藏夹,
博客
我机翻 我自豪~
Reply
呵呵 加个overflow 属性啊, overflow:hidden.
宽度超过50px,自动将其隐藏掉.
Reply
bigCat:
@任鸟飞, 我要的效果是小于50的时候容器也要自适应宽度变得小于50……
Reply
IE太破太难用
Reply
饿~~~~~~~~~~IE竟出新花样
Reply
Reply
Reply
將原本的
img{max-width:100px;}改為
img{max-width:100px;
width: expression(this.width > 100 ? '100px' : true);
}
即可解決
有其他問題歡迎來小站問我喔！感謝支持！
Reply
大猫:
@derek,
CSS expression 这么写有严重的性能问题,不停的reflow.... JS能轻松搞定的,就是想找个CSS的替代方案
Reply
derek:
@大猫,
不用JS看來是沒辦法，因為IE8以下不支援CSS3，除非你自己將IE重寫，置入CSS3解析引擎，然後拿到微軟官網發布，不然就是等待IE9吧！哈哈！!
Reply
derek:
@大猫,
這個問題就跟純CSS不用圖片跟JS來實現圓角的問題一樣
完全就是IE支援度的問題
沒有改變IE及使用者的能力就只能接受了
Reply
大猫:
@derek,
看来只能这样子了,还好做的站点IE优先级是最低的,排下来是iphone android blackberry safari/chrome firefox opera ie 8 7 6 渐进增强嘿嘿,谢谢~
Reply
等待I9~~~
Reply
记住这些错综复杂的，真的好难啊
Reply
Reply