[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 110
  • Last Modified:

Why is my background image looking like this?

Attached are two screenshots of a page that I built (http://www.mms-nashville.com/index.php). This first one represents what I intend the site to look like regardless of the size of the browser:

preferred
Here's what the same page looks like in a smaller browser:

wretched
What do I need to change in my CSS so the smaller browser scenario doesn't have that hideous white space going on on the left hand side?

My stylesheet is at http://www.mms-nashville.com/stylesheet.css

Thanks!
0
brucegust
Asked:
brucegust
1 Solution
 
chilternPCCommented:
the margin left is incorrect - it should be 50% of 1620px (the image you are using) so it should be -810px not -553px

so it should be:

@media screen and (max-width: 1620px) { /* Specific to this particular image */
  img.bg {
    left: 50%;
    margin-left: -810px;   /* 50% */
  }
}
0
 
GaryCommented:
Those slider images have a white border as do the top blocks!
0
 
brucegustPHP DeveloperAuthor Commented:
That did it!

Thanks!
0

Featured Post

The 14th Annual Expert Award Winners

The results are in! Meet the top members of our 2017 Expert Awards. Congratulations to all who qualified!

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