10 Replies Latest reply: Jan 22, 2008 12:17 PM by Nut Case
Nut Case Level 3 Level 3 (605 points)
im a prgrammer (whoopie!)

some of the sites i progrmmed recently are not working properly in the newest version of safari. while others are. all of the sites worked just fine in prior versions of safari then went wierd with the latest vers
all the sites i program have external cascading style sheets (CSS) that govern the appearnace of my html pages.

some of the sites are "listening" just fine to the external style sheets, while some are only picking up some or none of the styles in the the external style sheets.

i have tinkered with problem sites, ading html code to the html pages, bit by bit, to see if there is some erroneous code, there isnt, ive done the same with the css sheets, tweaking the script to see if i can force obvious changes, no luck.

anyone else had this issue?

anyone got any suggestions?


MacProBook 2.33 ghz w/2GB rams, Mac OS X (10.5.1)
  • iBod Level 7 Level 7 (29,340 points)
    Hi Wayne,

    I'm no expert at all, but can you post a link to the site in question? Others here may be able to help if they can see what the code is doing.
  • Nut Case Level 3 Level 3 (605 points)
    Hello IBod

    Thanks for reply and suggestion.

    here is link to site that is working properly:
    here is link to style sheet for same site:

    here is link to site that is having issues:
    here is link to style sheet for same site:

    the link to the external style sheet for both sites is written the same

    thank again
  • andyBall_uk Level 7 Level 7 (20,490 points)
    W3C's css validator does give warnings for the stylesheets, although hum, says they're valid

    chris teeter sculptures css

    but that's no help praps, since the treasures css validates ok w/o warnings.

    the xhtml code fails validation in both cases - rather more errors for the hidden treasures site - so take a look at these.... hopefully some difference will jump out.


  • Nut Case Level 3 Level 3 (605 points)

    i made up a test html page and a test css page

    cleaned up the code

    went to w3c, ran it, validated for both test files

    yet, safari seems to "see" the css file, yet will NOT acknowledge any of the markup. its baffling.

    im a little embarrased about above, that i didnt clean up code before posting, whoopise....


    APPLE, if yer reading this....

  • andyBall_uk Level 7 Level 7 (20,490 points)

    if W3C say the xhtml and the css is valid, then it's Valid imo - might be a safari 3.0x bug.

    you tried a recent nightly build of Webkit ??

    what problems show up in Safari 3.04? - post a screenshot if they're not speedily described - maybe someone can see if it's a 3.0.4 issue or just on Leopard
  • Nut Case Level 3 Level 3 (605 points)
    Andy Ball + IBod

    I figured it out, took me all day, urrr, but for some reason i feel good....

    safari 3.0.4 will not recognize any code after a # symbol WITHIN a css tag, and thus if one uses hex colours (eg. background-color: #FFFFFF; ), nothing will be read after that number/ colour.

    one has to use rgb colouring system ( background-color: rgb(255,255,255; ) for the entire sheet to be able to be read.

    i used to use the rgb sytem but i guess i got lazy a defered back to clunky old hex, shame on me!

    anyway, if anyone ever has an issue in this area, i do hope my nightmare can be of use.....

    NEVER USE "#" WITHIN CSS MARKUP, of course its just fine for actuall element identifiers....

    bye bye,
    i have a zillion client sites to go fix, before they notice!!!
  • Ted Harper Level 2 Level 2 (325 points)
    Hmm, I don't have that problem here (with Safari 3.0.4 on my 10.4.11 Macs). I might be misunderstanding what you've said above, but the following fragment of my CSS (and everything following/around it) is getting read correctly by Safari:




    What is different in your CSS from that which is causing Safari to not process it, so I can make sure we don't do it?
  • Nut Case Level 3 Level 3 (605 points)

    hrm, very interesting. it wereked for me, or was werking, i went into my css script and one by one,down the very long list, i changed each color, as i changed the colours, i would test the pages in sfari and the pages would load properly up to where the colours had been changed.

    all was going well and then i hit a wall. all coulours had been changed to rgb, but then one area just would not load right.

    after much tweaking and running thru w3c validation, i figured out that i had my "z-index" tags set too high and i suppose there is a limit at how high one can make them, is it under 100? anyway, after i lowered the numbers of the z-index's, everything loaded properly in safari.

    so, at end of day, im now not sure if its z-index or hex colours, all i do know is that, my site is werking well and it appaers that safaris standards are much more strct. which is ultimately a good thing.

    but the new safari does have bugs, some pages i go to immediately crash it. for instance i have a stupid blog, blogger, if i try to go to the edit posts pages, safari crashes, i sent apple a report.

    okay, i will stop
  • Ted Harper Level 2 Level 2 (325 points)
    The z-index seems much more likely. We've never had a problem specifying colour via CSS in hex (on any browser that I can remember) but definitely there is some upper limit to z-index where Bad Things start to happen.

    I don't know of an officially-documented upper limit (w3c says it's an integer with no official artificial maximum inside of that on the CSS spec pages I've found there, so I don't see a by-definition limit applying until you got up to a really silly number), but I'm sure we've hit issues with big z-index numbers before; can't remember if the point we got trouble was 100 or 1000, or which browser(s) it was with, but definitely keeping those z-index numbers smaller seems to help compatibility and correct rendering across all browsers.

    I'd say you were safe with the hex colours, and just to be careful with the z-index (among all the other bondary-conditions things you get caught out by with CSS across the various browsers).
  • Nut Case Level 3 Level 3 (605 points)
    i do know that at many of the very well laid out css example sites(zen garden, a list apart, eric myerand so on), thgey will use a z-index:100 for certain examples, that is the higest i have ever seen.

    i wonder why really high numbers would send it on a wobbl;y?

    i am embraased to say that i found a z-index in my script of 2000, i did it to ENSURE the item was on top, i guess i left it that way.


    enjoyable discussion, i taught myself css seberal years ago, out of necessity, ive got p[retty good at it but no master, i do not use any programs to write my script, i write straight code, i prefer it that way.

    heres another odd thing, when i embedded the same styles in thje head of each html page, they all worked.....

    anwya, all is well.

    sounds like ya know yer stuff. my ee is wayne@wayneleal.com