Исправление различий между браузерами

Question

Я только что создал новую функцию календаря, но у меня проблемы с кнопкой. В Firefox это выглядит хорошо, но в Chrome это выглядит ужасно.

Вот некоторые изображения, где вы можете увидеть разницу:

Firefox

Chrome

Может быть, вы знаете, как исправить т его.

HTML

<div class="controls input-append date form_datetimee" data-date="1979-09-16T05:25:07Z" data-date-format="yyyy/M/dd" data-link-field="dtp_input1"> 
    <input size="16" type="text" name="end_date" value="<?php echo $NewLogEndData; ?>" readonly/> 
     <span id="extro" class="add-on"><i class="icon-th"></i></span> 
</div> 

CSS

.input-append .add-on:last-child, 
.input-append .btn:last-child, 
.input-append .btn-group:last-child > .dropdown-toggle { 
    border-radius: 0px 4px 4px 0px; 
} 
.input-append .add-on, 
.input-append .btn, 
.input-append .btn-group { 
    margin-left: -1px; 
    margin-top: 2px; 
} 
.input-append .add-on, 
.input-prepend .add-on, 
.input-append .btn, 
.input-prepend .btn, 
.input-append .btn-group > .dropdown-toggle, 
.input-prepend .btn-group > .dropdown-toggle { 
    vertical-align: top; 
} 
.input-append .add-on, 
.input-prepend .add-on { 
    display: inline-block; 
    width: auto; 
    min-width: 16px; 
    padding: 1px 5px; 
    font-size: 14px; 
    font-weight: normal; 
    line-height: 20px; 
    text-align: center; 
    text-shadow: 0px 1px 0px #FFF; 
    background-color: #EEE; 
    border: 1px solid #999; 
} 
.input-append, 
.input-prepend { 
    white-space: nowrap; 
} 

Answer 1

Не видел весь код, но попробуйте добавить это:

input { 
    height: 20px; /* same as line-height */ 
    -moz-appearance: none; 
    -webkit-appearance: none; 
}