Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Feb 2011
    Posts
    109
    Thanks
    6
    Thanked 1 Time in 1 Post

    vertical and horizontal centered divs

    I'm looking to center divs on the x and y axis. I've followed the advice here (http://www.pmob.co.uk/pob/hoz-vert-center.htm) but the problem is there is a difference in layout between the example and what I require.

    I need to center this:

    Code:
    <body>
    <div id="main">
    	<div id="left"><img src="logo.gif" />
            </div>
            <div id="right"><p>text</p>
            </div>
    </div>
    </body>
    unlike the the link which centers everything, I want to center the #main and the image in #left on the left and the text in #right to appear on the right. I've messed around with floats but that didn't help.

  • #2
    Regular Coder
    Join Date
    Feb 2011
    Posts
    109
    Thanks
    6
    Thanked 1 Time in 1 Post
    Got it

    #main{
    position:absolute;
    height:500px;
    width:700px;
    background:blue;
    left:50%;
    top:50%;
    margin-left:-350px;
    margin-top:-250px;
    }

    #left{float:left;}

    #right{float: right;}


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •