Why won't my page center?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • cmgrickj
    New Member
    • Nov 2011
    • 4

    #1

    Why won't my page center?

    Hi,

    After pulling my hair out for hours last night, I humbly come to this forum for insight and help to my page centering problem. Can anyone please take a look and see what I'm doing wrong? I've used the body {text-align: left} and .wrapper {margin: 0 auto} to no avail, searched for missing Div tags, etc.

    The site is here:

    http://unstoppablefoun dation.org/galgal/
  • drhowarddrfine
    Recognized Expert Expert
    • Sep 2006
    • 7434

    #2
    It is centered. Did you fix this?

    Comment

    • cmgrickj
      New Member
      • Nov 2011
      • 4

      #3
      No, it's not centered, it's just a wide page. The .wrapper container is width: 1348px.

      Comment

      • zorgi
        Recognized Expert Contributor
        • Mar 2008
        • 431

        #4
        You have so much nesting its hard to see what is going on but using firebug I found that class video is applied to your html tag. Class video is only 560px wide and when I change it to width: 100% your page centers.

        When I look through your code i see this nesting:

        Code:
        <div class="centerpage">
         <div class="center">
           <div class="wrapper">
            <div class="main"></div>
           </div>
         </div>
        </div>

        I accept that for some reason you maybe had to do so much nesting but to name them like that makes it impossible to read or to understand.

        Comment

        • drhowarddrfine
          Recognized Expert Expert
          • Sep 2006
          • 7434

          #5
          In your html tag, you have a class of a large number of names. Removing that will center things. I haven't a clue what all that stuff in the class is for.

          Comment

          • cmgrickj
            New Member
            • Nov 2011
            • 4

            #6
            Guys thanks for these answers - centerpage and center classes were attempts to force it to center. I'll remove those.

            Those class names are applied through the HTML5Boilerplat e that I used. I need to remove those extra classes.

            Comment

            • cmgrickj
              New Member
              • Nov 2011
              • 4

              #7
              I've removed the extra centering divs and the JS that was putting all those classes in the HTML tag. Still not centering - but perhaps easier to troubleshoot now?

              Comment

              • drhowarddrfine
                Recognized Expert Expert
                • Sep 2006
                • 7434

                #8
                It looks centered to me. What is not centering to you? Which element?

                Comment

                • zorgi
                  Recognized Expert Contributor
                  • Mar 2008
                  • 431

                  #9
                  @drhowarddrfine Khmmm .. I have 1920 x 1080 resolution and it doesn't look centered :) Everything is left aligned.

                  @cmgrickj
                  now when you cleared your code just add to your wrapper class following:

                  Code:
                  margin-left: auto; 
                  margin-right: auto;
                  Happy centering :D

                  Comment

                  Working...