<h1>Combobox</h1>
<p>A fixed-list combo box is when a user can type a certain string, and there is a list of strings that is designed to help the user arrive at a value. Try it out!</p>
<input type="text" name="fruit" list="fruits" autocomplete="off" />
<datalist id="fruits">
<option>Apple</option>
<option>Banana</option>
<option>Orange</option>
<option>Pineapple</option>
<option>Kiwi</option>
</datalist>
<small><p>Question of the week from Cassidoo's Newsletter. <a href="https://buttondown.email/cassidoo/archive/when-youre-accustomed-to-privilege-equality-feels/" target="_blank" rel="noopener">Go subscribe!</a></small></p>
/* Display only. Not needed! */
@import 'https://raw.githubusercontent.com/jonathantneal/system-font-css/gh-pages/system-font.css';
body {
background: dodgerblue linear-gradient(22deg, aqua, dodgerblue, deeppink) fixed;
color: white;
font: normal 32px/1.6 system-ui, sans-serif;
text-shadow: 0 1px 1px hsl(0 0% 0% / 20%);
margin: 3rem;
}
h1 {
font-weight: normal;
}
a {
color: inherit;
}
a:focus,
a:hover {
text-decoration-color: black;
}
input {
font: inherit;
padding: 0.2em 0.5em;
}
// Not needed!
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.