I can't center a website in Safari - Can Anyone help? Is it possible?

Discussion in 'HTML & Website Design' started by colinph970, Dec 3, 2011.

  1. #1
    I have a website at:

    http://lazypassiveearnings.com/lazypassiveearnings.html

    it shows left aligned in safari and I want it tb be center aligned no matter what the browser or settings.

    I've tried div align tags etc but does not work.......anyone help or advise how to do it?
     
    colinph970, Dec 3, 2011 IP
  2. kazymjir-design.com

    kazymjir-design.com Peon

    Messages:
    11
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    First, remove this:
    <style type="text/css"> body {align:center;}   </style>
    Code (markup):
    And change this:
    <body style="margin-left: 57px; width: 854px;">
    Code (markup):
    to
    <body>
    Code (markup):

    Next:

    Create new div in CSS :
    #wrapper {
       width: 854px;
       margin: 0 auto;
    }
    Code (markup):
    and then put your whole website in this div.
     
    kazymjir-design.com, Dec 3, 2011 IP
  3. colinph970

    colinph970 Active Member

    Messages:
    410
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    68
    #3
    I have done the first two but don't understand the last step:

    Next:

    Create new div in CSS :
    Code:
    #wrapper {
    width: 854px;
    margin: 0 auto;
    }
    and then put your whole website in this div.


    Could you explain what this means?

    regards
    Colin
     
    colinph970, Dec 3, 2011 IP
  4. kazymjir-design.com

    kazymjir-design.com Peon

    Messages:
    11
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I've made necessary corrections in your code: pastebin.com/EV7mgFc2

    I've created new CSS style and embedded it in your HTML code:
    <style type="text/css">
                #wrapper {
                    width: 854px;
                    margin: 0 auto;
                }
            </style>
    Code (markup):
    I've put your whole website in DIV that uses the CSS I wrote before, just added <div id="wrapper"> after <body> and closed it (with </div>) before </body>.

    This CSS style is creating invisible box of width of 854px with your website and centers it in browser window.
     
    kazymjir-design.com, Dec 3, 2011 IP
  5. colinph970

    colinph970 Active Member

    Messages:
    410
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    68
    #5
    FANTASTIC!

    Many thanks............
     
    colinph970, Dec 3, 2011 IP
  6. kazymjir-design.com

    kazymjir-design.com Peon

    Messages:
    11
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    No problem!
     
    kazymjir-design.com, Dec 3, 2011 IP