WordPress.org

Ready to get started?Download WordPress

Forums

Vertical-align:middle on #page (4 posts)

  1. MultiformeIngegno
    Member
    Posted 2 years ago #

    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!! :D

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

  2. pixelrow
    Member
    Posted 2 years ago #

    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.

  3. MultiformeIngegno
    Member
    Posted 2 years ago #

    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 :)

  4. MultiformeIngegno
    Member
    Posted 2 years ago #

    Ok, margin:0 auto did the trick! :)

Topic Closed

This topic has been closed to new replies.

About this Topic