Support » Fixing WordPress » Vertical-align:middle on #page

  • Hi guys!
    I created a TwentyEleven child theme, and I’m trying to vertically center the main <div> (#page). Here’s the website: http://compagniaoltreconfine.com/beta/

    As you can see I’m trying with these CSS:
    body, html, #wrapper { width: 100%; height: 100% }
    #wrapper { display: table }
    #main { display: table-cell; vertical-align: middle !important }

    And I added a <div> wrapper before #page.

    This method doesn’t work.
    It’s 5 days I’m trying to achieve this, please help me!! 😀

    P.S.: Don’t suggest me to use position:absolute and negative margins because my website doesn’t have a fixed height

Viewing 3 replies - 1 through 3 (of 3 total)
  • pixelrow

    (@pixelrow)

    http://blog.themeforest.net/tutorials/vertical-centering-with-css/

    P.S.: Don’t suggest me to use position:absolute and negative margins because my website doesn’t have a fixed height

    Vertical height isn’t easy – if you are that keep think about changing to position:absolute and making content scrollable.

    I managed to get it vertically aligned!!!!! ;))
    Now the problem is with horizontal align… I can’t use position:absolute;left:50% because it would break the vertical-align:middle and display:table-cell…

    Link is still the same to view the website 🙂

    Ok, margin:0 auto did the trick! 🙂

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Vertical-align:middle on #page’ is closed to new replies.