October 28th, 2004, 10:32 AM
Bold formatting inside a select box?
I want to have certain elements in a selectbox appear in bold. Is this possible?
.. but it didn't work.
October 28th, 2004, 10:40 AM
I was able to get partially acceptable results in Firefox with:
IE ignored it.
<option style="font-weight:bold">This is bold text</option>
<option>This is normal text</option>
I've changed the background and font color of a select option with CSS before so I know that's possible (and it worked in IE). maybe you could do that instead.
October 28th, 2004, 02:22 PM
Originally Posted by wdn2000
your rite ie isnt the only one to fall over when trying to style this tag, i think the bottom line is, the option tag and the newish kid on the block 'optgroup' have limited styling that can be applied to them, also bearing in mind users of older browsers won't see the effort anyways, ie 5.5 for example doesnt even see optgroup
of course opening the option tags (group) is the select tag which again has only limited styling choice
so far i'v only ever been successful with this (example) ...
accompanying css ...
<select name="month" class="month">
<option value="january" selected>january
<option value="may" class="one">may
in each case the, font-size:18px;font-weight:bold; is ignored, but at least you can 'highlight' with background color
hope that helps... take care... ian
feel free to email me... the cockney one...
February 22nd, 2014, 03:13 AM
Originally Posted by ian ocky
I am making course registration system and in options I want to make first part bold and second italic how can I do that?
BOLD : NC/NA-L
February 23rd, 2014, 07:20 PM
As established by other people, and I have tried with <b> and other tags, <option> does not take tags within it.
What you can do, since you cannot use <span> inside an <option> tag,
You can use the index number to extract the text via
document.getElementById(selectid).options[x].text where x is the relevant index, as a variable.
Then what you do is use the " (" to split the variable into the time, and remove the last character as well which removes the ")"
var text = document.getElementById("main").options.text
var tlength = text.length
var splitno = tlength - 1
var text2 = text.slice(0, splitno)
var textArray = text2.split(" )")
var time = textArray
var hours = textArray
Changing it is much simpler:
/* add your code here to determine the value for the time (use variable time) */
/* add your code here to determine the value for the hour (use variable hours) */
var textvalue = time + " (" + hours + ")"
If you use a for function you can change each value of the select replacing 1 with 2, 3 and so on, and put a set interval function to constantly update it.