Link to home
Start Free TrialLog in
Avatar of sumachaa
sumachaa

asked on

Select Box Option Bold

hi

How can i make an option in the select box bold....

eg:

<select name="lbimages" id="lbimages" style="width:300px">
                <option>image1</option>
      <option>image2</option>
      <option>image3</option>
      <option><strong>image4</strong></option>
</select>

i want to display the option image4 as bold...

is there anyway i could do this....


thanks
sumesh

ASKER CERTIFIED SOLUTION
Avatar of dorward
dorward

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
try:

<option style="font-weight: bold;">blah</option>

not tested (i'm a little buzzed and too lazy to look it up)
if you'll look at the timestamps, we entered at the exact same time ;) so i was right... even when drunk :)
Avatar of sumachaa
sumachaa

ASKER

hi all

<option style="font-weight: bold;">blah</option>  is not working

i can only specify some diferrent for the the one like

<option style="color: red;">blah</option>

but the bold option doesnt work.... is there any specific reason for it....??








> but the bold option doesnt work.... is there any specific reason for it....??

Your browser doesn't support it.
The only valid  CSS options for option are color and background-color.  all othere attributes are inherited or defaulted.  any other attribute support is non-standard and browser specific.

Cd&
COBOLdinosaur: I'm a little confused, are you talking about attributes (HTML things like <tag attribute='value'>) or properties (CSS things like { property: value; })? If properties, where does it say that only color and background-color apply to <option> elements?
Actually, I think I mispoke.  The limitation is the OS, which is what the browsers all use to implement the select element.  I guess a browser could just let you do what  you want with the options, but it would mean they would have to create there own object for the select or start overriding part of the OS object.  

As for attributes/properties, I tend to interchange them depending on which object my head has most reacently been in because the fill the same role in the two diffrent approaches.

Cd&
Browsers (not all browser) can and do implement <select> elements as browser controls rather then OS controls. Firefox, for example, supports it (and presumably so do all browsers of the Gecko/Mozilla/Netscape6+ family.
Netscrap uses OS and as of 1.6 Mozilla uses it but puts a few things on top of it.  Firefox ilooks good but it is still beta and there are some bugs to be worked out.

Cd&
Nutscrape4 rocks! ;^)
All this for 20 points? Yikes
Try the opposite then.
<style>
select {font:bold 12px tahoma;color:red}
</style>

<select>
<option>Lub</option>
<option style="font-weight:normal">Nub</option>
the thing is you need to set it on the <select> tag not on the <option> tag like Cd& said. but it'll make the whole select box bold:

<select name="lbimages" id="lbimages" style="width: 300px; font-weight: bold;">
     <option>image1</option>
     <option>image2</option>
     <option>image3</option>
     <option>image4</option>
</select>
No...You can set it on the whole option
I mean select...I'm fighting for those 20 points, man...heh heh. Life or death situation...
Avatar of seanpowell
No points please - just some comments:

@dorward
>>If properties, where does it say that only color and background-color apply to <option> elements?

For IE at least, it's here:
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/option.asp
"Except for background-color and color, style settings applied through the style object for the option element are ignored..."

As has been correctly stated, if you're not seeing it, your browser doesn't support it. (Currently IE and Opera AFAIK)

FWIW, here's a fully cross-browser, cross-media implementation of letting a user know that one of the options is unique from the others.

<p>Items marked with an * are currently on sale</p>
<select id="myselect" size="1">
  <option value="bww">bmw</option>
  <option value="audi">* audi</option>
  <option value="vw">vw</option>
</select>

Ah, specific browser support rather then the specification. That clears things up. Thanks.
http:#10419760 is the correct answer on this one...