views:

19

answers:

2

Hello,

I am having a problem displaying a webpage on Safari. It will not display center, but will instead displays the page to the left and has a huge amount of empty space to the right of it. I don't get this behaviour with Firefox, IE, or Chrome. Can anyone tell me what is going on and how to fix it. The website can be viewed at: digitaldementia.ca. You can view the CSS from your browser when you visit the site. If it is desired I can post it here as well.

Thanks for your help.

+2  A: 

Try this CSS:

html, body{
  text-align:center;
}

#main_container{
  margin:0px auto;
  text-align:left;
  width: 900px; /* set width accordingly */
}

where #main_container is supposed to be the main container/wrapper of your site.

Sarfraz
If you set `min-width` and `max-width` you'll get some elasticity on your page. Otherwise nothing more to say here. Best solution imho :)
gearsdigital
A: 

In your case the huge amount of empty space comes from your div #copyright

Solution:

#copyright {
    color:#B8DBFF;
    padding-right:25px;
    position:relative;
    text-align:right;
    top:20px;
}

or

#container {
    color:#FFFFFF;
    margin:20px auto;
    padding:0;
    position:relative;
    text-align:left;
    width:989px;
    overflow:hidden; /* added */
}
gearsdigital