Я пытаюсь добавить тень блока на два входа рядом друг с другом, но тени перекрывают входы.
Я пытался добавить position: relative
и z-index
к входным данным, но затем тень перекрывает входные данные с наименьшим z-индексом.
Есть ли способ предотвратить перекрытие тени другим входом рядом с ним?
HTML:
<form method="post">
<input name="email" type="text" >
<input name="send" type="submit">
</form>
CSS:
.email {
height:45px;
width: 395px;
float: left;
box-shadow: 0 0 40px 6px rgba(0,0,0,0.65);
-webkit-appearance: none;
}
.search {
height: 45px;
width: 60px;
float: right;
box-shadow: 0 0 40px 6px rgba(0,0,0,0.65);
cursor: pointer;
-webkit-appearance: none;
}
Вот пример того, что я имею в виду:
Спасибо :) - Джеспер