Reputation: 1
HTML
<input type="email" placeholder="Email Address" id="main-input" >
<span id="arrow-icon"><img src="images/icon-arrow.svg" alt="arrow icon"></span>
<span id="error-icon"><img src="images/icon-error.svg" alt="error icon"></span>
CSS
#main-input{
width: 400px;
height: 30px;
border: 2px solid lightgray;
border-radius: 30px;
z-index: 100;}
#main-input:focus { outline: none !important; border: 2px solid hsl(0, 93%, 68%);}
#arrow-icon{ width: 90px; height: 52px; position: absolute; background:linear-gradient(to right, hsl(0, 80%, 86%) 0%, hsl(0, 74%, 74%) 100%) ; margin-top: 35px; margin-left: -91px; border-radius: 30px; box-shadow: 3px 16px 10px 0px #f4dddd; cursor: pointer;} #arrow-icon img{ /* width: 10px; height: 20px; */ margin-left: 41px; margin-top: 15px;}`
Upvotes: 0
Views: 262
Reputation: 36
Upvotes: 0