Hello, I have a problem into my css style.css, I wanna make a limit when letters be close into search button. When letters cross the red line. new texts will be added before red line.
.search input[type=text]{
height: 50px;
max-width: 80%;
width: 500px;
background: linear-gradient( to bottom, #aaa, #555);
border-radius: 30px;
border: 0;
outline: 0;
padding-left: 8px;
color: #fff;
box-shadow: 0px 0px 15px 0.5px #000;
}
.search input[type=text]::placeholder{
color: #bbb;
}
.search button{
margin-left: -50px;
background: transparent;
position: relative;
border: 0;
outline: 0;
color: #fff;
}
<center>
<form class="search">
<input class="search-box" type="text" name="search" placeholder="Search..."></input>
<button class="search-btn" type="submit" name="search_btn"><i class="fa fa-search"></i></button>
</form>
</center>
