Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Why does this look different in Safari?

Posted on 2014-09-11
1
166 Views
Last Modified: 2014-09-20
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
Comment
Question by:brucegust
1 Comment
 
LVL 38

Accepted Solution

by:
Tom Beck earned 500 total points
ID: 40318489
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

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

856 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question