#1
  1. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2003
    Posts
    52
    Rep Power
    12

    css drop down color change?


    Ok so I've got a dropdown menu (what you use to select size/font/color when posting a thread) for a search form i'm doing, but the thing is nothing i seem to do in css seems to be able to get rid of the ugly grey outline and grey dropdown button, but as i'm seeing here on the forums the same ugly grey outline appears, is this a problem that is only resolved with like the latest version of i.e., is it possible or not?

    Thank you,
    Robert Velasquez
    UpBeetMusic.com
  2. #2
  3. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    4
    Rep Power
    0
    Hi UpBeetMusic

    I had the exact same qustion a while ago, searched the whole of the internet and from what i could find you can not change the colour of the drop down menu arrow, you can change the text inside the background colour but you cant get rid of the greyness.
  4. #3
  5. Senior Polecat
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2003
    Location
    Jersey (the original version)
    Posts
    210
    Rep Power
    12
    i'm afraid the dude is right (big lebowski fan by any chance?)

    The reason you can do so little with <select> tags is due to the way they are rendered in IE. IE uses the standard windows dropdown menu for HTML dropdowns (a bit of lazy coding on the part of M$). Because these elements are standard windos controls you can't do an awful lot with them. Try testing your style in Mozilla and see what you can do there.
    Quidquid latine dictum sit, altum viditur.

    http://www.XSet.co.uk
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2000
    Posts
    763
    Rep Power
    0
    I believe Mozilla for windows has the same problem that IE does.
  8. #5
  9. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    147
    Rep Power
    12
    It's worth noting, that for an element with id 'the_select', mozilla offers these properties in its DOM:
    Code:
    # the_select.style.MozAppearance =
    # the_select.style.MozBackgroundClip =
    # the_select.style.MozBackgroundInlinePolicy =
    # the_select.style.MozBackgroundOrigin =
    # the_select.style.MozBinding =
    # the_select.style.MozBorderBottomColors =
    # the_select.style.MozBorderLeftColors =
    # the_select.style.MozBorderRadius =
    # the_select.style.MozBorderRadiusBottomleft =
    # the_select.style.MozBorderRadiusBottomright =
    # the_select.style.MozBorderRadiusTopleft =
    # the_select.style.MozBorderRadiusTopright =
    # the_select.style.MozBorderRightColors =
    # the_select.style.MozBorderTopColors =
    # the_select.style.MozBoxAlign =
    # the_select.style.MozBoxDirection =
    # the_select.style.MozBoxFlex =
    # the_select.style.MozBoxOrdinalGroup =
    # the_select.style.MozBoxOrient =
    # the_select.style.MozBoxPack =
    # the_select.style.MozBoxSizing =
    # the_select.style.MozCounterIncrement =
    # the_select.style.MozCounterReset =
    # the_select.style.MozFloatEdge =
    # the_select.style.MozForceBrokenImageIcon =
    # the_select.style.MozImageRegion =
    # the_select.style.MozKeyEquivalent =
    # the_select.style.MozOpacity =
    # the_select.style.MozOutline =
    # the_select.style.MozOutlineColor =
    # the_select.style.MozOutlineRadius =
    # the_select.style.MozOutlineRadiusBottomleft =
    # the_select.style.MozOutlineRadiusBottomright =
    # the_select.style.MozOutlineRadiusTopleft =
    # the_select.style.MozOutlineRadiusTopright =
    # the_select.style.MozOutlineStyle =
    # the_select.style.MozOutlineWidth =
    # the_select.style.MozResizer =
    # the_select.style.MozUserFocus =
    # the_select.style.MozUserInput =
    # the_select.style.MozUserModify =
    # the_select.style.MozUserSelect =
    I've never actually tried modifing them - but I'm guessing they are there to specifically modify the way Mozilla renders the element. Post back if you get it working.
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Posts
    12
    Rep Power
    0

    Wink <select> tag color question


    Hello all,

    I have a question that related to your topic.

    I am using a style sheet to format my drop down menus.
    I have the <select> tag formatted to my liking.

    I have 2 dropdowns and I want one of them to be in another color.

    I tried making a 2nd <select> tag, called it <select2> But the page doesn't recognize it.???

    I am CSS challenged.... Can any of you help me?

    Is it possible to make 2 different dropdowns????

    Thanks

    -Tuck
  12. #7
  13. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2000
    Location
    Leuven, Belgium
    Posts
    39
    Rep Power
    14
    Hey Tuck01,

    It's faily easy, but you should step away from the general css formatting of <select>. Rather make 2 css classes, for instance select1 and select2. Then, in your HTML, apply the wanted style to each select-box like this:

    [PHP]<select name='select' class='select1'>[PHP]

    ... and so on. Easy enough?
  14. #8
  15. Controlfreak
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2004
    Location
    Netherlands
    Posts
    32
    Rep Power
    11
    Originally Posted by tuck01
    Hello all,

    I have a question that related to your topic.

    I am using a style sheet to format my drop down menus.
    I have the <select> tag formatted to my liking.

    I have 2 dropdowns and I want one of them to be in another color.

    I tried making a 2nd <select> tag, called it <select2> But the page doesn't recognize it.???

    I am CSS challenged.... Can any of you help me?

    Is it possible to make 2 different dropdowns????

    Thanks

    -Tuck
    You can give both dropdowns a different css class, or define css style for both inside the tags, instead of an external stylesheet.
  16. #9
  17. Controlfreak
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2004
    Location
    Netherlands
    Posts
    32
    Rep Power
    11
    Has anyone yet found a way to format selct dropdowns properly? I can alter the border of input tags etc. but select won't work. Is this indeed a rendering problem? because I recall to have seen something like I want to do on another site. I just can't remember where....
  18. #10
  19. Cunning Linguist
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2003
    Location
    I used to live at home, now I stay at the house
    Posts
    10,180
    Rep Power
    2038
    Dropdowns are actually part of your OS, and not the browser, so there is unfortunately nothing you can do to change their appearances...

IMN logo majestic logo threadwatch logo seochat tools logo