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

    Join Date
    Apr 2009
    Posts
    63
    Rep Power
    5

    Colour display in combo on Mac


    I have some php code that retrieves names from a MySQL database and displays them in a drop down combo box. The code checks if it is a lady and displays the name in red typeface. If it is a man then it displays in black. The font is retrieved from a css file where there are two typefaces described; one for the black display and the other for the red display.

    This works fine on the PC using IE, Chrome, Firefox or even Safari. However, on the Mac (using Safari or Chrome) it simply displays in black type. Can anyone help to explain this and what I need to do to ensure that the red typeface is displayed when it is a lady?
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Frequenter (2500 - 2999 posts)

    Join Date
    Dec 2004
    Posts
    2,868
    Rep Power
    368
    how about posting the relevant code to see how you are doing it?
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2009
    Posts
    63
    Rep Power
    5
    okay here it is .....

    PHP Code:
    if ($row["sex"] == "f")
        {

    $string.=" <option class=\"main_heading\" value=".$disp.">".$row["name"]." - hcp = ".$row["hcp"]."</option>";
        }
    else
        {

    $string.=" <option value=".$disp.">".$row["name"]." - hcp = ".$row["hcp"]."</option>";
        } 
    and this is the relevant part of the css file

    Code:
    .main_body {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; font-style: normal; color: #000000; font-weight: normal}
    A {color:blue;font-weight:normal}
    A:hover {text-decoration:none;color:red}
    .main_bullet { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; font-style: normal; color: #000000; font-weight: normal ; list-style-position: outside; list-style-type: disc}
    .main_body_small { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 6pt; font-style: normal; color: #000000; font-weight: bold}
    .main_body_med { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; font-style: normal; color: #000000; font-weight: bold }
    .main_body_med_link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; font-style: normal; color: #0000FF; font-weight: bolder}
    .main_heading { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18pt; font-style: normal; color: #FF3333; font-weight: bold}
    .credits { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 6pt; font-style: normal; color: #000000; font-weight: normal}
    .menu_link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 7pt; font-style: normal; color: #3333FF; font-weight: bolder }
    .menu_link_ul { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 7pt; font-style: normal; color: #3333FF; font-weight: bolder ; text-decoration: underline}
    .main_title { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14pt; font-style: normal; color: #000000; font-weight: bold }
    .main_body_AGM { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; font-style: normal; color: #000000; font-weight: normal}
    .main_body_highlight { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; font-style: normal; color: #FFFFFF; font-weight: bold ; background-color: #666666}
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Frequenter (2500 - 2999 posts)

    Join Date
    Dec 2004
    Posts
    2,868
    Rep Power
    368
    link to a page perhaps?

    in the mean time, install firebug and inspect the said element to see what styles are being set (or not)

    I think i know what is going on. You would like to change the individual OPTION value's color differently? Sorry some browsers do not allow you to do that as you have just found out. I am not sure what the solution is
    Last edited by paulh1983; October 2nd, 2013 at 10:54 AM.
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2009
    Posts
    63
    Rep Power
    5
    link to a page perhaps?
    Not sure what you mean paulh1983?

    As I said, the code works fine on a PC with IE, Chrome, Firefox and even Safari. But on the Mac, I'm told using both Safari and Chrome, it doesn't work (nor incidentally does it work on an iPad with Safari).

    The reason for wanting different colours for male and female is because it is a Tee Time draw (in golf) and the person doing the draw is trying to balance the sex of players in a flight.
  10. #6
  11. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Oct 2009
    Location
    Nebraska, USA
    Posts
    829
    Rep Power
    275
    I realize its considered OK to not use the semi-colon ( ; ) on the last property:value; pair...but, what happens if you add that last semi-colon back in for each rule?
    Does that make any difference in whether or not it , then, works on MAC?

    And paul1983 is asking for the link to your site's page that is giving issues as it is easier for us to gain better understanding if we can see the "whole picture" instead of just bits and pieces of code segments.
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Frequenter (2500 - 2999 posts)

    Join Date
    Dec 2004
    Posts
    2,868
    Rep Power
    368
    but i tried to do this, i remember and failed. You cannot change the individual options in a select drop down! i said as much already. (well you can but as you have seen it will give inconsistent results)

    Comments on this post

    • Kravvitz agrees
  14. #8
  15. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2009
    Posts
    63
    Rep Power
    5
    And paul1983 is asking for the link to your site's page that is giving issues as it is easier for us to gain better understanding if we can see the "whole picture" instead of just bits and pieces of code segments.
    Sorry, I'm unable to do this as it is password protected as it contaisn confidential information (and you could do untold damage in any case by overwriting huge amounts of the database. The code should be sufficent to illustrate the problem which only occurs on the Mac and iPad.
  16. #9
  17. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,122
    Rep Power
    4258
    You couldn't copy the source from your browser and then remove irrelevant portions and sanitize the rest? However, in this case, this is obviously a known limitation of browsers and so seeing your code wouldn't really help us to help you.

    As Paul said, browsers only support a limited number of CSS properties on form controls, especially on <select> elements and their children. Which properties and how many are supported varies from browser to browser.
    http://www.456bereastreet.com/archiv...form_controls/
    http://www.456bereastreet.com/archiv...form_controls/

    By the way, are you aware that many of those CSS styles could be written more efficiently?
    Efficiently Rendering CSS
    Writing Efficient CSS
    What is shorthand CSS?
    Efficient CSS with shorthand properties
    CSS - shorthand properties
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  18. #10
  19. No Profile Picture
    Permanently Banned
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    48
    Rep Power
    0
    very helpful thanks,

IMN logo majestic logo threadwatch logo seochat tools logo