Fog Creek Software
Discussion Board

Images and dropdown form elements

Any CSS gurus read this forum?

I want to do two things:

a) bold an item in a dropdown (I can colour the background, but I can't bold the text)

b) place a picture as part of the dropdown text (anyone know if this is possible?)

If anyone can help me out, that would be much appreciated.  Where do you folks usually go to get answers to picky questions like this?  I find that most sites are too basic and/or poorly laid out to be of much help (the w3 CSS section drives me nuts!)


Thursday, April 10, 2003


This should help

Thursday, April 10, 2003

This is my resource for such things, very skilled users there.

Thursday, April 10, 2003

Its hard to say without the code in front of me, but I would wager you're pulling off a drop down by using an undordered list.  In this case you'll want just add the image ( you may have to add a class to make it inline if you've set it globally to display:block to avoid Gecko rendering  issues in Strict mode).

As for making a specified element bold, if you can change the background you should be able to make the contents bold.  I would suggest invetigating the CSS at work there - some browsers have  a hard time with certain weights - I believe 800 is always a safe bet for getting bold, but you can get bold without specifing a weight number.

Thursday, April 10, 2003

Thanks Damian, the way they do it is via a table - which would work but isn't quite what I was hoping for.  If all else fails, I guess.

Jeff: That's a great link, Thanks!

Lou: I'm actually creating a list of dates, with the currently selected date highlighted (but I'd like it to be bold instead), and an arrow "<-" (but I'd like this to be an image) before the first date and an arrow "->" after the last date.  The idea is that the user can select the first (or last) date, and the dropdown then refreshes to show dates before (or after) the selected date, to allow easy navigation through dates without providing a monster dropdown.

So it would look something like this:
<- Feb 2003
<b>Mar 2003</b>
Apr 2003 ->

If you select Feb, it would change to:
<- Jan 2003
<b>Feb 2003</b>
Mar 2003 ->

I hesitate to admit this, but I have no idea what you mean by "I would wager you're pulling off a drop down by using an undordered list." 

My code looks like:

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

If I set background-color: blah, then I can change the background.  Changing the font-weight has no effect whatsoever.

Thursday, April 10, 2003

The <option> element in a <select> list only allows a very limited set of CSS style options. You can set the "background-color" and/or the "color", but not "font-weight", "font-size", etc. Most style properties for <option> are inherited from the <select> object.

Philip Dickerson
Thursday, April 10, 2003

*  Recent Topics

*  Fog Creek Home