Grow your CSS skills. Land your dream job.

MAC ie display issues

  • # May 12, 2009 at 1:39 pm

    Yo…

    http://www.unioncitycc.org/final.html

    I’ve been working on this site for my Church for some time, and testing it to get it just right. Everything seemed OK, until I got the wild hair to check M$ie on the MAC. Issues… lots of ‘em.

    CSS seems to be playing well in MAC FF, WIN FF, and WIN ie… however, none of the background images display correctly in ie for MAC, so… I’m open for suggestions. Frankly, I was a little shocked that there was such a significant display difference when it was playing well in everything else that I checked. <head scratch>

    Here’s a couple screen shots to gander at… #1 is the issue
    ieMAC shot:
    [img]http://www.unioncitycc.org/images/ieMACshot.jpg[/img]
    This one doesn’t retain my columns, displaces the footer, displaces some of the right side elements, removes my navigation list at the left & removes nearly all of the graphics for the background.

    ffMAC shot:
    [img]http://www.unioncitycc.org/images/ffMACshot.jpg[/img]
    Gotta love FireFox… good ol’ compliant tastiness.

    I have a separate issue in WIN ie, which is a minor glitch in displaying an image at the bottom of the page. I reserved myself to not worrying about it since the lack of the image doesn’t really take away from the site aesthetics.

    Regards!

    DD

    # May 12, 2009 at 2:13 pm

    I find it hard to believe there are any Mac users out there using IE, there have been no major updates since 2000 and it’s not been available for download since January 2006.

    I wouldn’t worry about it.

    # May 12, 2009 at 2:15 pm

    Apostrophe,

    I was falling in line with your thinking before I posted, but I thought I’d check to see if there were any suggestions.

    Thanks!

    DD

    # May 12, 2009 at 3:40 pm

    Just to follow up, Microsoft removed all IE downloads for Mac users long ago. I haven’t tested IE on a Mac in… well… forever? Don’t worry about it.

    # May 12, 2009 at 4:20 pm

    I second the motion, don’t waste your time getting your page to display properly in ie/Mac. It may have been a game changer back in the day, but it’s obsolete now.

    # May 13, 2009 at 2:31 am

    I’ve also never checked that. Sounds like death on a stick.

    I will mention you’ve got some invalid CSS though… which will probably won’t do anyway to make it work in that browser, but you never know.
    http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fwww.unioncitycc.org%2Ffinal.html

    # May 13, 2009 at 8:45 am

    Ashton,

    I’ve cured the CSS invalidation… I nearly screamed when I pulled up the page, after validating it before, and found that it was chocked full of issues. New(er) and tastier version is up now.

    Turns out, the issues were simple errors on my part, except that I had added a Google Map link which contained some stuff that invalidated my code. W3C doesn’t like the ampersand, = sign or the word "state" found in the link.

    Anyone have any suggestions on how to add a Google Map link that will not invalidate the CSS?

    Thanks!
    DD

    # May 13, 2009 at 9:59 am

    I’m still getting the same bunch of css errors

    Quote:
    URI : http://www.unioncitycc.org/mine.css
    177 h2 Value Error : font-style attempt to find a semi-colon before the property name. add it
    202 #calwrap Property align doesn’t exist : center
    URI : http://www.unioncitycc.org/msie.css
    3 #container, #footer, #datebar Value Error : width Parse Error document.body.clientWidth 740? "740px" : document.body.clientWidth > 1400? "1400px" : "auto")
    URI : http://www.unioncitycc.org/remotenav.css
    15 ul li#podcast a Parse Error no-repeat
    21 ul li#scholar a Parse Error no-repeat
    29 ul li#video a Parse Error no-repeat
    35 ul li#phone a Parse Error no-repeat
    43 ul li#blog a Parse Error no-repeat
    49 ul li#resources a Parse Error no-repeat
    57 ul li#map a Parse Error no-repeat
    64 ul li#calendar a Parse Error no-repeat

    If you fix the remotenav problems you might find it solves some of your ie6 issues. You can write them out something like this:

    Code:
    ul li#podcast a {
    background: url(images/matrix.jpg) no-repeat 0 0;
    }

    As regards the Google Map link you can replace the ampersands with &amp; To the best of my knowledge there is no problem with the = sign, my guess is that the validator was referring to what comes before or after. Having said that, if the rest of the page validates then don’t sweat it. If it works in all browsers it’s good. ;)

    # May 13, 2009 at 11:28 am

    *blush*

    OK… so I pulled a lame & only validated my code, not my css.

    Thanks for the input Apostrophe… good stuff, and the css rewrite was very helpful. I need to learn how to trim a little better so that I can create slimmer css.

    The remote nav issue is resolved, and now instead of 11 css errors, I’m showing only 3. I’ll jump on those a little later.

    It looks like I’m going to do a rework of my images to remove alpha. At this point, it looks easier to do this than to embed a gif along with a png. I don’t want to bloat my code or have additional load due to images when I can just redo some of the work.

    So, I’ll rework my css to remove some of the divs which will no longer be necessary, and I’ll redo my images in jpg rather than png. I’m getting there… slowly, but surely.

    Create, exasperate, accommodate… gotta love Bill G’s idea of compliance. ;)

    Thanks!
    DD

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".