<form action="https://google.com/search" method="get" target="_blank">
<input type="search" name="q" placeholder="Search...">
<input type="submit" value="Search Google...">
</form>
form {
margin: 4rem auto;
width: 600px;
display: flex;
}
input {
font-size: 1rem;
border-radius: 6px;
border: 1px solid #bbb;
}
input[type="search"] {
padding: 12px 16px;
width: 100%;
}
input[type="submit"] {
display: inline-block;
padding: 12px 16px;
margin-left: 16px;
background-color: #ddd;
}
input[type="submit"]:hover {
cursor: pointer;
background-color: #bbb;
}
This Pen doesn't use any external JavaScript resources.