• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 176
  • Last Modified:

Why does this look different in Safari?

Head out to http://hihatwebdesign.com/vbs/student_list.php

In IE, the background color is seamless, but in Safari, there's a very definite break (see screenshot).

How can I accommodate this in my stylesheet or is there something I need to be doing that's not happening which would give me the seamless background color after the top gradient?
Screen-Shot-2014-09-11-at-4.58.45-PM.png
0
brucegust
Asked:
brucegust
1 Solution
 
Tom BeckCommented:
Try this:

Remove the backgrounds from #wrapper, #right_cloud, and #left_cloud divs.

Then use this for the html and body:

html, body {
    background: url("images/right_cloud.jpg") no-repeat fixed left top;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    margin: 0;
}

The idea is to spread the cloud background to always fill the browser window.

I looked at this site in Safari, Chrome and Firefox on a Mac and all showed the hard line between the cloud background and the solid color.

On a side note, you should familiarize yourself with the COPPA guidelines. Essentially, any identifiable information of minors should be secured behind a password.
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now