Neverside

CSS/XHTML Questions

Hi. I hate IE so much that sometimes I think I should just stick to server side coding and/or compiled languages.

Anyway, my first question. Does anyone know how I can colour option elements in a drop down list? If I apply a style to the select element, it works fine across both IE and Gecko browsers, but if I apply it to option, IE doesn't recognise it (except bg colour only...weird pos). I need to do this because only certain values need to be in a different style. Google didn't help much.

Second question: I'll ask this a little later :P Just got an idea

Thanks in advance.

Hmm..ok here's the second question. Have a look at screenshot I've attached. Basically it's something like this:

Code:

<ul>
<li class="menu"><img src="" onclick="" /><a href="">Category</a>
<!-- Sub menu items here which you can't see -->
</li>

<li class="menu"><img src="" onclick="" /><a href="">Category</a>
<!-- Sub menu items here which you can't see -->
</li>
</ul>

Obviously that's extremely simplified to make it easier to read. What I need to do is to prevent the longer category names from going under my plus/minus sign. I can make the plus/minus sign into a list-style-image but that's won't make it clickable. I can cheat and it make it 2 table columns but that won't even be a last resort.

Any ideas? Thanks

Last edited by kgx, February 1st, 2006 03:41 AM (Edited 1 times)

Make the plus sign a background image, and give your list items a padding to the left that is the same width of the image (or more if you want more room ). This allows the plus to still be clickable, and prevents text from going under the plus.

As far as styling the options, it would probably be your best bet to use javascript and completely swap out the <select> element. Check out this article: http://easy-designs.net/articles/replaceSelect/

That's what I thought at first as well but that way, the link and the plus sign will have to serve the same purpose. In my case, the plus sign only expands it whereas the link takes it to a thumbnail sort of page. Anyways, not much of a big issue. Might be able to do with css and negative margins. Even the folks at msdn used table cells to do it

Interesting you should mention the second link, I got to there with google as well Thanks for that though, I might have to settle for it since there are no other options left *pun*