This is my code and I was wondering how to make “Select current role” with blurry font…
<label id="current-role"> Which option best describes your current role?
<select id="dropdown" >
<option>Student</option>
<option>Fulltime Job</option>
<option>Fulltime Lerner</option>
<option>Prefer not to say</option>
<option>Others</option>
</select>
</label>
Read this Doc: How to Create a Blurry Text
Hope this helps,
Thanks,
Hal Jordan
First, I would not wrap a label around the select like that. Make it a separate element before the select and then use the for attribute to associate it with the select. This will make styling a little easier.
Then you can style the label text however you like to make it blurry. But be careful, it still needs to be readable. The blurry text in the photo above does not have enough color contrast with the background color to be accessible.
Oh wait, I think I read your question wrong, you want to know how to make the currently selected option in the select list blurry, is that right?
yes 
i want to learn how to make a blurry text on the
I’m not sure you will be able to do what you want to do with a select. The browsers just don’t really let you customize the select drop down at this point in time. I think a lot of people get around this by creating a custom select using a list and JS to mimic the select behavior.
Can you give us a URL to the example you showed us above?
URL is from the certification project of (New) Responsive Web Design on making survey form, so the actual URL doesn’t exist but you could find it under here:
Sorry, I should have been more clear. I meant the example in the pic you posted above, the pic that shows what you are trying to do. Do you have a URL for the page you took that pic from?
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.