2 willerfu Willerfu 于 2016.03.02 15:46 提问

手机UC浏览器 select下拉框内容被遮挡,不能正常显示,求解决。

图片说明

 <div class="col-xs-10 col-xs-offset-1 form-box">
            <div class="form-content">
              <form>
                <div class="form-group">
                  <label class="sr-only">学校</label>
                  <select class="form-control input-lg" id="school">
                      <option>选择学校</option>
                  </select>
                </div>
                <div class="form-group">
                  <label class="sr-only">用户名</label>
                  <input type="text" class="form-control input-lg" id="username" placeholder="用户名">
                </div>
                <div class="form-group">
                  <label class="sr-only">密码</label>
                  <input type="password" class="form-control input-lg" id="password" placeholder="密码">
                </div>
                <div class="checkbox">
                  <label>
                    <input type="checkbox" id="UserMsg"> 记住密码
                  </label>
                </div>
                <a id="login" class="btn btn-lg btn-primary btn-block">登 录</a>
              </form>
              <br>
              <div class="mesg1 alert alert-danger" role="alert" style="display:none">请选择学校!</div>
              <div class="mesg2 alert alert-danger" role="alert" style="display:none">用户名或密码不能为空!</div>
              <div class="mesg3 alert alert-danger" role="alert" style="display:none">用户名或密码错误,请重试!</div>
            </div>
          </div>

上面是我的登录部分代码,使用bootstrap写的,手机UC会出现这样的情况,自带浏览器倒是没有问题,求大神点睛!!!

1个回答

caozhy
caozhy   Ds   Rxr 2016.03.08 12:14
已采纳

这是uc的bug,针对uc浏览器做点css hack,比如把输入框的margin改小

Willerfu
Willerfu 谢谢啦,我后面把input的尺寸改小了,就好了,感谢
2 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
解决div层被select下拉框遮盖的问题
在IE里,层DIV被下拉框SELECT遮盖,这是IE的bug之一,原因在于select的优先级别比div高。因此无论如何用css属性z-index设置都没用。所以,解决的办法有两种在显示div的时候隐藏所有select让div里的内容比select的优先级还要高第一种方法显然比较麻烦,特别是当select比较多且位置不固定的时候,很容易将不该隐藏的也隐藏了。第二钟办法更好一些。常用的优先级比sel
div被select下拉框挡住了--5种解决方法
在IE中,select属于window类型控件,它会“挡住”所有非window类型控件可以这么理解,div这样的组件是在浏览器客户区使用代码“渲染”的,他们被渲染在客户区的绘画表面上,而select是使用的标准windows控件,只是作为客户区的子控件放置而已,它会覆盖所有客户区绘画表面上“画”出来的一切,但不一定会覆盖其他类型的window控件,比如iframe和其他的sel
解决layui弹窗下的下拉选择框被遮挡或显示不全问题
问题:在做后台的时候想要实现这样一个功能,点击弹出一个窗口,窗口是下拉选择框,给用户选择。用到了layui,但是却发现,弹窗虽然固定了高宽,但是里面的下拉框,在显示的时候却被弹窗挡住了,导致滚动条出现。 如下图: 后来发现只要是不用layui提供的下拉选择框,是不会出现被遮挡的问题的。 但是我还就非要用了,怎么滴了吧... 研究很久,怎么解决呢?
下拉菜单被挡住了,DIV置于最底层的方法
网站常会用到一些 下拉菜单,,幻灯片,,,飘浮广告等。但经常会发现。幻灯片会挡住下拉菜单或者飘浮广告等。解决办法有下第一,可将幻灯片所在DIV 置于最底层。添加CSS如下style=&quot;z-index:-100;position: relative;&quot;第二,可将被挡住的DIV/ul/li 置于最高层。添加CSS如下style=&quot;z-index:9999;position: relative;&quot; 在使...
前端排坑记录:解决下拉菜单被图片或DIV遮挡问题
下拉菜单被下面的各种奇奇怪怪的元素遮挡,被图片遮挡、被P标签遮挡。。。一开始遇到这个问题的时候,我也想到了肯定是z-index的缘故,然后就去给下拉菜单了一个position:relative; z-index:999;本以为可以解决问题,结果一经测试,还是老样子,如图:然后就是各种尝试,给遮挡它的元素也设置z-index:9;给下拉菜单的子元素设置z-index:999。。。还是没一点反应求助度...
iview select 弹窗向上时被遮挡住了解决办法
&amp;lt;li class=&quot;clearfix&quot;&amp;gt; &amp;lt;label&amp;gt;招标组织方式&amp;lt;/label&amp;gt; &amp;lt;Select v-model=&quot;filters.zbzzfs&quot; style=&quot;width:200px;&quot; transfer=&quot;true&quot;&amp;gt; &amp;lt;Option value=&quot;
利用jquery解决下拉菜单被Div遮挡问题
用jquery的hover事件,当鼠标移动到menu时,把遮挡下拉菜单的div设置为负值,鼠标离开时恢复正值, 代码如下: $("#menu").hover( function() { $(".divName").css("z-index", "-1"); }, function() { $(".divName").css("z-index", "0"); });
Bootstrap的下拉菜单被挡住
Bootstrap的下拉菜单被挡住 代码 div class="range"> div class="dropdown" style="float:right"> button class="btn btn-success" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expand
前端框架layui下拉框被遮挡问题
      在使用layui做下拉框选项的时候发现有时候下拉框会被遮挡或者根本就出不来的现象于是看了一下审查元素发现原本的div只有这么大仔细找了一下发现是layui自带的class属性问题,overflow:hidden,所以下拉框出现的内容被隐藏了解决方法:在页面里面找到对应div的class 给overflow新的属性visible即可(默认值。内容不会被修剪,会呈现在元素框之外。)即可显示...
Div被Select挡住解决办法
Div被Select挡住解决办法         Div下拉菜单被Select挡住的解决办法     onmouseover="this.style.height=100;" onmouseout="this.style.height=18;">             left: 0; scrolling: no;" frameborder="0" src="about:blan