zoukankan      html  css  js  c++  java
  • 前端开发在uc浏览器上遇到的坑

                                  关于uc 的flex 和textarea 的width:100%;

    这些天再做一个wap的项目,本想着手机上不用考虑兼容性问题,可以大刀阔斧搞,fuck ie678!

    在pc上完成页面开发,在chrome模拟器上做页面的矫,good!一切看起来都是很美好的样子~~

    打开手机测试页面,想想都有点小激动呢!扫码,。。。。。。。。。。卧槽,啥浏览器这是!卧槽,这是uc吗!

    尼玛,居然我的一个最简单页面都不能正常显示,毕竟只是只有两个textarea的页面啊,我擦,这都能出错!??@@...

    检查了代码,测试了其他浏览器只有uc是这样,textarea宽度设置width:100%;并不能全屏。console了body和textarea的宽度,分别是360 和348。后来发现居然有uc开发版,可以pc调控手机,大喜过望,然并卵。。。并没有发现多余的padding和margin,而且除了textarea别的标签都可以100%。

    测试连接:http://jielan.sinaapp.com/4.html

    项目逼近,必须得把这个丑陋的输入框改掉啊!

    除了设置宽度100%还有别的方法么,卧槽,对了,display:flex;后来我给textarea找了个父元素宽度100%,textarea就flex:1;忐忑中再次扫码,凑!好样的,就是我要的100%!

    好哒,解决了剩下的那一个,如法炮制就ok了,哈哈,真是佩服自己的机智。加父元素,复制css,ctrl+s,扫码。

    卧槽,傻了,尼玛怎么都是一半的宽度。

    ( ⊙ o ⊙ )是的!就酱紫,项目逼近啊。。。肿么办!!!只有特么的uc!!!fuck uc!!!╮(╯▽╰)╭,还得解决问题啊,试了很多属性都不行。最后删除复制错了,尼玛居然ok了。

    父元素去掉display:flex;子元素都是flex:1.宽度100%;就这样uc就是全屏了。

    别问我为什么,可能这就是爱吧。。。爱是解释不清楚的。。。

    另外,如果你的flex元素是input你需要给它指定display:block才能让它去自适应宽度。还有inpu要写明高度height,不然你一输入就是高度变低,然后在恢复回去,真是奇葩哦。。。。。。

    别问为什么,可能真的就是uc的爱        

  • 相关阅读:
    VS2013编写的C#程序,在xp下会报错说“不是合法的win32程序”。
    能根据串口驱动来 确定com号
    javaweb工程,Servlet里面获取当前WEB跟路径的文件绝对路径地址
    import了sun开头的类,虽然它在代码里压根就没派上用处!但是必须得引用!
    页面关闭时触发的时间
    jquery设置元素的readonly和disabled
    ibatis CDATA
    form的submit与onsubmit的用法与区别
    C#操作AD及Exchange Server总结(一)
    AD如何用C#进行增删改、查询用户与OU
  • 原文地址:https://www.cnblogs.com/happycloud/p/4585696.html
Copyright © 2011-2022 走看看