У меня есть следующие строки кодов;
<div class="col_full">
<input type="text" id="email" placeholder="Email" name="email" value="<?=(@isset($_COOKIE['ll1']) ? $_COOKIE['ll1'] : '')?>" class="form-control not-dark" />
</div>
<div class="col_full">
<input type="password" placeholder="Password" id="password" name="password" value="<?=(@isset($_COOKIE['ll2']) ? $_COOKIE['ll2'] : '')?>" class="form-control not-dark" />
</div>
Как видите, они имеют одинаковые имена классов.У них разные идентификаторы, но код css для них одинаков, как показано ниже:
#email{
font-size: 20px;
background-color: rgba(255,255,255,0.1);
height: 50px;
width: 100%;
border: rgba(255,255,255,0.1);
border-radius: 10px;
color: #FFFFFF;
}
#password{
font-size: 20px;
background-color: rgba(255,255,255,0.1);
height: 50px;
width: 100%;
border: rgba(255,255,255,0.1);
border-radius: 10px;
color: #FFFFFF;
}
В chrome и firefox они выглядят одинаково, но когда я открываю страницу по краю, поле пароля имеетдругой вид дизайна.
Вид Firefox и Chrome такой же, как на этом скриншоте https://i.ibb.co/tXnXmZq/chromefirefox.png
Edge такой же https://i.ibb.co/JscdTnC/edge.png
Я не понимаю, почему это происходит, и я незнаю, как ее решить.