Ivan
Ivan

Reputation: 1517

Padding differences in anchor element and input element with same style

I have the next input and anchor elements:

<input type="submit" class="button" name="add" value="Button 1" />
<a class="button" href="cpanel.php">Button 2</a>

The css is:

 input, textarea, select, button 
 {font-size: 100%;font-family: inherit;margin:0;padding:0;}  

.button{
    border: 1px solid #9B9B9B;  
    background-color: #DADADA;
    padding: 0; 
    margin: 0 20px 5px 0;   
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;  
    cursor: pointer;
 }

The problem is that firefox shows both buttons with different padding:

enter image description here

I use a reset css code and I define a line-height attribute in body.

Thanks.

Upvotes: 2

Views: 1171

Answers (1)

Elen
Elen

Reputation: 2343

try:

input::-moz-focus-inner
{ 
    border: 0;
    padding: 0;
}

Upvotes: 4

Related Questions