Grow your CSS skills. Land your dream job.

Rounded Corners and Safari 4.0.3

  • # August 12, 2009 at 2:22 pm

    I am creating a website with rounded corners. I watched Chris’ video on rounded corners, and I’m using #4 (jquery method). It works well in IE and Firefox, but in Safari (on a PC) the corners have a black background.

    Am I doing something wrong, or is there a setting in the js file that I can change?

    You can see the page at http://www.robinescott.com/crywolf/index.html. The header is an image, so it displays correctly. The white space behind the photo is where I’m using the jquery method to display the rounded corners.

    Here’s the CSS I’m using (I just changed .box-four to .box-main)

    .box-main {
    width: 928px;
    background: #ffffff;
    border: 1px solid #ffffff;
    margin-bottom: 14px;
    margin-top: 2px;
    margin-right: 0px;
    margin-left: 0px;
    }
    .box-main .inside { padding: 20px; }

    I’d appreciate any help you can give me.

    Thanks,
    Robin

    # August 14, 2009 at 7:23 am

    For some reason, the "rgb (241,241,241)" is being rendered as pure black in Safari 4.0.3. Maybe you already know that’s the culprit. After a quick search of "jquery safari 4 rgb issues" and related keywords I found nothing of importance.

    maybe there’s something in the jquery code itself? :?

    good luck! and be sure to post your findings when you figure it out

    # August 21, 2009 at 6:17 pm

    I gave up and used Chris’ method 1 (the cheat method of using images). It works but it’s surely not the best solution. Thanks for your assistance.

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

You must be logged in to reply to this topic.

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