Question

我在登录表格上工作。我已经通过在googlechrome上测试了所有属性。完成表格后我在mozilla中检查了它。我指定的尺寸完全改变了特别是高度。我知道背后的原因。这是我的代码

input
{
  padding: 13px 14%;
 }
#email-wrapper #email-label
{  
  border: 1px solid #e5d4c2;
border-radius: 3px 0 0 3px;
border-right: 1px solid #FFF;
display: inline-block;
height: 39px;
line-height: 36px;
vertical-align: middle;
margin-right: 0;
width: 36px;
}

    #email-wrapper #email-label label 
{
  background: url("~/application/modules/User/externals/images/mail.png") no-repeat              scroll 19px 13px #FFFFFF;
       background-size: 15px 15px;   
    }
#email-wrapper #email-label label
{
 color:transparent;
   }

Answer 1

请使用此CSS和跨浏览器：

input{
    padding: 13px 14%;
}

#email-wrapper #email-label{

    border: 1px solid #e5d4c2;
    -webkit-border-radius: 3px 0 0 3px;
       -moz-border-radius: 3px 0 0 3px; 
         -o-border-radius: 3px 0 0 3px; 
        -ms-border-radius: 3px 0 0 3px;
            border-radius: 3px 0 0 3px;
    border-right: 1px solid #FFF;
    display: inline-block;
    height: 39px;
    line-height: 36px;
    vertical-align: middle;
    margin-right: 0;
    width: 36px;
}

#email-wrapper #email-label label {
    background-image: url("~/application/modules/User/externals/images/mail.png") 
    background-repeat:no-repeat;
    background-color:#FFFFFF;
    background-position:19px 13px;
    background-size: 15px 15px;   
}
#email-wrapper #email-label label{
    color:transparent;
}

Answer 2

观看CSS代码之后我的假设是两个浏览器的输入字段高度都不同。通过将样式输入到输入字段，您的问题应该解决..

您需要在输入字段中添加这些属性..

input
{
  padding: 13px 14%;
  border:1px solid #666;
  border-radius:5px;
 }

我希望这对你有用。

此致

css使用zend工作精细铬但不在mozilla中

2 个答案: