У меня есть некоторые различия в макете в IE и в Chrome. Я искал переполнение стека все выше и ниже для решений и пробовал некоторые из них ... Я попытался установить размер окна в исходное состояние ... это не сработало ... Поэтому попытался установить высоту текстового поля, которое он работал, но все же большие различия. Я также попытался изменить тип документа на строгий. Я столкнулся с этой проблемой как часть моего проекта.
Проблема:
У меня есть форма в теге Div. В форме есть 4 строки текстового поля. Я поместил предварительный просмотр в IE и предварительный просмотр в Chrome рядом, чтобы сравнить и понять, что именно расстояние между текстовой областью вызывает различия в высоте.
Код в моем html-файле:
<div class="leftdetails">
<form class="form2" name="form2" method="post" action="">
<label for="fname">First Name: </label>
<input type="text" name="fname" id="fname" class="regfields"/>
<br />
<label for="cdsid">CDSID: </label>
<input type="text" name="cdsid" id="cdsid" class="regfields"/>
<br />
<label for="mail">Mail Drop: </label>
<input type="text" name="mail" id="mail" class="regfields"/>
<br />
<label for="dateofbirth">D.O.B.: </label>
<input type="text" name="dateofbirth" id="dateofbirth" class="regfields"/>
<br />
</form>
</div>
код на моем CSS (внешний)
.leftdetails
{
font-family:Myriad Pro;
font-size:18px;
float:left;
width:50%;
text-align:center;
}
.regfields
{
width:200px;
height:20px;
vertical-align:bottom;
}
.form2
{
text-align:right;
margin-right:50px;
}
Это еще не опубликовано в Интернете, поэтому нет ссылки ... но я буду рад предоставить скриншот. Это очень незначительная разница, но я просто хочу понять, почему.