Здравствуйте, уважаемые форумчане) Помогите с небольшой проблемой. Криво отображается блок в Firefox. Хотя в Chrome все нормально.
Хром Firefox
Код CSS и HTML:
.mail-delivery {
box-sizing: border-box;
float: right;
width: 560px;
max-height: 220px;
padding: 6px;
color: #5a5a5a;
font-weight: 400px;
border-radius: 16px;
background: url("../img/message-pattern.png") #fff;
}
.message-wrapper {
box-sizing: border-box;
width: 549px;
max-height: 208px;
padding:5px 20px 5px 20px;
background-color: #f8f7f4;
border-radius: 15px;
clear: both;
}
.message-wrapper p {
box-sizing: border-box;
margin-bottom: 35px;
color: #5a5a5a;
font-size: 16px;
font-weight: 400;
line-height: 22px;
}
.message-wrapper form {
font-size: 0px;
}
.feedback.pop-window {
display: block;
}
.message-wrapper input[type="email"] {
box-sizing: border-box;
display: inline-block;
width: 356px;
margin: 0;
margin-right: 10px;
margin-bottom: 36px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 12px;
color: #323232;
font-size: 16px;
line-height: 24px;
vertical-align: top;
box-shadow: 0 0 0 2px #d3d3d2;
border: none;
border-radius: 5px;
}
.message-wrapper input[type="submit"] {
display: inline-block;
padding:10px 21px;
color: #fff;
font-size: 17px;
line-height: 24px;
vertical-align: top;
font-weight: 700;
text-align: left;
border: 0;
border-radius: 40px;
background-color: #e94e37;
background-image: linear-gradient(to bottom, #f26843 0%, #e74b36 100%);
box-shadow: 0 2px 2px rgba(172, 16, 0, 0.64);
cursor: pointer;
outline: none;
}
<div class="mail-delivery clearfix">
<div class="message-wrapper">
<p>
Подпишитесь на нашу сладкую рассылку и будете всегда в курсе всего самого вкусного, что у нас происходит. Обещаем не спамить и не слать всякой не нужной ерунды. Честно =)
</p>
<form class="message-delivery" action="url" method="get">
<input class="form-field" id="mail" type="email" name="email" placeholder="Электронная почта" required>
<label class="login-form__label" for="mail">Электронная почта</label>
<input type="submit" value="Отправить">
</form>
</div>
</div>
