Thu, 2010-06-03 01:00
I'm trying to use the :before or :after pseudo classes on the following select and option elements in conjunction with the content CSS:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <style> option:before {content:'Sample';} </style> </head> <body> <select> <option></option> </select> </body> </html>
Is it possible to do so?
Thu, 2010-06-03 02:56
#1
Welcome to the forum.
When you ask, "is it possible to do so", I have to ask if you've tried it. Have you? What was the actual html and css? What was the result?[1]
To give you a leg up, see my little demo, form layout using css, and its associated stylesheet form.css.
cheers,
gary
1. Be sure to read the sticky posts at the top of each forum. There are a pot load of info on commonly asked issues, and our little statement on what we expect folks to bring to the party.
Thu, 2010-06-03 20:20
#2
Yes, I have tried it.
Hi, Gary. Thanks for the reply. Yes, I have tried several variations on it. I have also scoured the Net looking for info on it, but trying to do a search with the keywords 'before,' 'after,' 'select,' 'option,' and 'content' will not necessarily get you the results you want.
I looked for an answer here but did not come up with one. Perhaps there isn't one. I don't know. I was hoping if I could clarify the question I might get a more reliable response.
Thanks!
Fri, 2010-06-04 00:52
#3
Sorry, I thought I had given
Sorry, I thought I had given you a hint. Form controls are inline replaced widgets. Adding text doesn't make sense, and isn't doable, to my knowledge. Add the generated text to a related element that can hold text, for example, the accompanying label element:
<p><label for="state">State</label> <select name"state" id="state"> <option>New York</option> </select> </p> =============== label:before { content: "Sample "; }
cheers,
gary