I'm working on a Vue project with a small app featuring an input type search. The issue I'm facing is that the cursor appears at the beginning of the input, whereas I want it to appear after the placeholder text. How can I make this adjustment?
Below is my code snippet:
.search {
height: 36px;
width: 256px;
margin-right: 42px;
border: 1px solid #76b1c5;
box-sizing: border-box;
border-radius: 18px;
}
<input
type="search"
name=""
id=""
class="search"
placeholder="search" />
Here's the corresponding CSS:
.search {
height: 36px;
width: 256px;
margin-right: 42px;
border: 1px solid #76b1c5;
box-sizing: border-box;
border-radius: 18px;
}