欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

laydate兼容bootstrap

程序员文章站 2022-05-01 23:06:06
...

laydate兼容bootstrap

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年9月8日 10:33:43 星期二

http://fanshuyao.iteye.com/

 

在使用Bootstrap后,再使用laydate,框会偏移一点,原因是Bootstrap使用了 * {box-sizing:border-box;}

来reset浏览器的默认盒子模型。所以加上以下样式就能兼容Bootstrap了

 

  1.  .laydate_box, .laydate_box * {
          box-sizing:content-box;
    }
     
  2. 另外,由于input的样式不一样,导致输入框大小不一致,可以加上下面的样式兼容:
  3. input.laydate-icon,div.laydate-icon{
    	display: block;
    	width: 100%;
    	height: 34px;
    	padding: 6px 12px;
    	font-size: 14px;
    	line-height: 1.42857143;
    	color: #555;
    	border: 1px solid #ccc;
    	border-radius: 4px;
    	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    	-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    	-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    }
    div.laydate-icon{
    	text-align: left;
    }
     

 

 

 

 

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年9月8日 10:33:43 星期二

http://fanshuyao.iteye.com/