Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 12 of 12
  1. #1
    New Coder
    Join Date
    Nov 2007
    Posts
    38
    Thanks
    2
    Thanked 0 Times in 0 Posts

    WTF?! Different colors...?!

    This is probably a simple fix but I'm not seeing it and am getting frustrated.

    http://www.drewdizzle.com/optimumhm/index.html

    The colors are the friggin' SAME, yet are displayed as different in all browsers I've tried (IE, FF, and SAF). The colors for the menu are assigned in "css/menu.css" and are #505050. That's what they are in Photoshop for the small logo and the masthead as well. I'm baffled.

    WTF?!

  • #2
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    is the logo in RGB or CMYK?

  • #3
    New Coder
    Join Date
    Nov 2007
    Posts
    38
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by jcdevelopment View Post
    is the logo in RGB or CMYK?
    already checked that... they're all in RGB

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    FF 2.0.0.12 PC seems to be displaying things correctly, as does Safari 3 Beta for PC. IE renders the color on PNGs slightly darker than they should be, this is because they got the gamma- and color-corrections incorrect. This is has always been an issue in previous versions of IE. According to my onscreen color picker the color in IE is #454545.

    I use Pixie to pull the colors from the screen.

    What you could do is use conditional comments. Add this after your main stylesheet in your html.
    Code:
    <!--[if IE]>
    <link rel="stylesheet" href="iestyle.css" type="text/css" />
    <![endif]-->
    Then in iestyle.css add this
    Code:
    #menu {
    	background: #454545;
    }
    #menu a {
    background: #454545;
    }
    Also that height:1&#37;; might effect other browsers. You should either use min-height or give that height to IE only.

    More info on conditional comments.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #5
    New Coder
    Join Date
    Nov 2007
    Posts
    38
    Thanks
    2
    Thanked 0 Times in 0 Posts
    PNGs aren't the problem. It's the menu (Home, Services, etc.) and the dropdowns.
    Last edited by DrewDizzle; 02-28-2008 at 09:29 PM.

  • #6
    New Coder
    Join Date
    Nov 2007
    Posts
    38
    Thanks
    2
    Thanked 0 Times in 0 Posts
    as a temporary fix, i changed all the PNGs to GIFs, which display proper 505050. I'd prefer to use PNG or JPGs when this goes live because I have how GIFs pixel-ize the faces on the masthead. Thoughts?

  • #7
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    The only browser that was displaying the pngs incorrectly is IE. Keep the pngs and use the fix I gave you. I don't see the problem here.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #8
    New Coder
    Join Date
    Nov 2007
    Posts
    38
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by _Aerospace_Eng_ View Post
    The only browser that was displaying the pngs incorrectly is IE. Keep the pngs and use the fix I gave you. I don't see the problem here.
    No because the problem is existent in Safari and FF on OS X. I'm sitting here looking at it.

  • #9
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    You never mentioned that you were on OS X. On PC those browsers render everything fine.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #10
    New Coder
    Join Date
    Nov 2007
    Posts
    38
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by _Aerospace_Eng_ View Post
    You never mentioned that you were on OS X. On PC those browsers render everything fine.
    You're right... I thought I did but ended up editting that post. Odd that it renders fine on PC. I'm at a loss... I tried the #454545 fix and it didn't match her on Safari OS X.

  • #11
    Master Coder
    Join Date
    Feb 2003
    Location
    Umeå, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Is the colour profile and gamma correction for the PNGs correctly set? Mac has a different default gamma than Windows, and I believe which colour profile a Mac has depends on whether it's CRT or TFT, where Windows uses the same colour profile all over.

    (I believe there's some incompatibilities in some browsers when it comes to gamma correction and colour profiles. I can't recall if there's a best-fit option for either though, but I would expect sRGB and Gamma 1.0 to work best across the board.)
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #12
    New Coder
    Join Date
    Nov 2007
    Posts
    38
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by liorean View Post
    Is the colour profile and gamma correction for the PNGs correctly set? Mac has a different default gamma than Windows, and I believe which colour profile a Mac has depends on whether it's CRT or TFT, where Windows uses the same colour profile all over.

    (I believe there's some incompatibilities in some browsers when it comes to gamma correction and colour profiles. I can't recall if there's a best-fit option for either though, but I would expect sRGB and Gamma 1.0 to work best across the board.)
    I'm happy to use JPG... was just using PNG out of habit. I hate having to use GIF because it distorts the images. Any ideas? How do other sites get around this?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •