+ 2
How do i style the content in <option> tags of <datalist> using CSS ?
Styling of elements.
2 Réponses
+ 3
You can't style the drop down of input box because browsers default it.
The closest solution is to use JQuery "autocomplete" extension, ref:
https://stackoverflow.com/questions/10062414/is-it-possible-to-style-the-drop-down-suggestions-when-using-html5-datalist
+ 3
<options> in <datalist> isn`t flexible to handling and styling with .css, instead of <datalist> tag you can use <select> tag to create a drop-down datalist.
I hope this would be helpful for you.
<!DOCTYPE html>
<html>
<body>
<h1>The option element</h1>
<label for="color">Choose a color:</label>
<select>
<option >black</option>
<option >white</option>
<option >red</option>
<option >blue</option>
</select>
<style>
select {
font-size:30px;
color:squre;
background-color:white;
width:200px;
text-align:center;
font-family: "Lucida Console", "Courier New", monospace;
}
select option{
color:green;
}
</style>
</body>
</html>